Seznam je určený pro všechny frontend designery, kteří se ptají, kde je možné sledovat nejnovější trendy a informace týkající se webových technologií. Chtěl bych v něm postupně popsat nejzajímavější internetové a knižní zdroje, které stojí za to sledovat. Jako médium jsem zvolil právě GitHub, protože umožňuje ostatním přidávat návrhy na změny a udržovat tak seznam aktuální. Pokud tedy víte o něčem zajímavém, co vám v seznamu chybí, otevřete novou issue a popište váš návrh na nový zdroj.
- Brad Frost - Blog written by Brad Frost — a web designer, speaker, consultant and author of Atomic Design.
- CSS-Tricks - CSS-Tricks has come to become a site about all things web design and development.
- Inclusive Components - A blog trying to be a pattern library, with a focus on inclusive design. Each post explores a common interface component and comes up with a better, more robust and accessible version of it.
- Je čas 🇨🇿 - Blog, který autor založil k uchování a sdílení poznámek, hotových řešení, rad a nápadů k tvorbě webových stránek.
- Smashing Magazine - Magazine for web designers and developers.
- SUPERKODERS 🇨🇿 - Blog brněnské firmy SUPERKODERS s články o jejich práci a webovém frontendu.
- Vzhůru dolů 🇨🇿 - Populární český blog o webovém frontedu. Autorem je Martin Michálek, známý specialista na CSS a responzivní design.
- CSS Layout News - Tutorials, news and information on CSS Layout.
- CSS-Tricks - Newsletter about web design and development.
- CSS Weekly - CSS articles, tutorials, experiments and tools.
- Dev Tips - Tips mostly for Chrome DevTools in the form of a animated gif.
- Responsive Design Weekly - Responsive design articles, tools, tips, tutorials and inspirational links.
- Smashing Magazine - Useful tips, tricks and resources for frontend designers — collected, written and edited by Smashing Magazine.
- Design Systems - As designing static pages has become untenable, many have started to approach design in a modular way. Book is new practical guide to creating effective design languages for great digital products. Více v recenzi… (2017; Smashing Magazine - Alla Kholmatova)
- Vzhůru do (responzivního) webdesignu 🇨🇿 - Kompletní průvodce návrhem a implementací responzivních uživatelských rozhraní. Více v recenzi… (2017; Martin Michálek)
- Vzhůru do CSS3 🇨🇿 - Vylepšete své znalosti webové kodéřiny aktuálním přehledem nástrojů a nových CSS3 vlastností v jednom e-booku. (2017; Martin Michálek)
- Inclusive Design Patterns - This book explains how we can craft accessible interfaces without extra effort — and what front-end design patterns we can use to create inclusive experiences. Více v recenzi… (2016; Smashing Magazine - Heydon Pickering)
- Atomic Design - Book covers all that goes into creating and maintaining effective design systems. (2016; Brad Frost)
- Practical SVG - From software basics to creating icon systems and implementing fallbacks, Chris Coyier shows you how to harness the power and possibilities of working with SVG. - (2016; A Book Apart - Chris Coyier)
- Web ostrý jako břitva 🇨🇿 - První česká kniha o návrhu webu. Webdesign není jednoduchý, jen podceňovaný. Kniha ukáže začínajícím webdesignerům cestu, zkušeným doplní mezery a zadavatelům ušetří statisíce za špatně navržený web nebo nesmyslný tendr. (2014; Jan Řezáč)
- Brus kódu 🇨🇿 - Podcast o front-endových vývojářích a technologiích. Natáčení podcastu přerušeno.
- Vzhůru dolů 🇨🇿 - Rozhovory s českými osobnostmi webdesignu.
- CSS Flexbox Layout
- Přehled na Vzhůru dolů 🇨🇿 - Co je to Flexbox?, Položky layoutu, Kontejner
- A Complete Guide to Flexbox
- CSS Grid Layout
- HEAD - Podrobný průvodce elementy, které je možné použít v hlavičce HTML dokumentu.
- HTML5 Accessibility - Aktuální přehled podpory přístupnosti HTML5 vlastností u nejpoužívanějších prohlížečů.
- CSS Support Guide for Email Clients - Podrobný přehled podpory CSS vlastností napříč mobilními, webovými a desktopovými emailovými klienty.
- CSS Protips - Seznam užitečných tipů, které pro efektivnější práci s CSS na webu.
- A collection of tips to help take your CSS skills pro.
- Grid by Example - Projekt Rachel Andrew, který by měl obsahovat vše potřebné pro pochopení CSS Grid Layout. Vše je obohacené o příklady a návrhové vzory.
- Learn CSS Grid - Průvodce, který pomůže porozumět možnostem CSS Grid Layout.
- The Modern JavaScript Tutorial - Kolekce JS návodů popisujících řešení základních i složitějších problémů, se kterými se setkáváme při webovém vývoji.
- You Might Not Need jQuery - jQuery je na webech hojně používané. Často však potřebujeme jen zlomek jeho funkcí. Stránka poskytuje ucelený přehled základních funkcí jQuery a jejich alternativních zápisů pomocí JavaScriptu.
- Introduction to HTML - Interaktivní kurz pro pochopení základů HTML.
- Introduction to CSS - Intraktivní kurz pro pochopení základů CSS.
- Introduction to JavaScript - Interaktivní kurz pro pochopení základů JavaScriptu.
- Beginning HTML & CSS - Videokurzy základů HTML a CSS.
- Codeacademy - portál online výukových kurzů
- Learn HTML - Interaktivní kurz základů HTML.
- Learn CSS - Navazující kurz pro pochopení základů stylování webu pomocí CSS.
- Make a Website - Kurz tvorby jednoduchých webů pomocí HTML, CSS a s využítím frameworku Bootstrap.
- Hello, animation! - Interaktivní kurz pro výuku CSS animací.
- Learn Flexbox for free - Výukový kurz CSS Flexbox.
- Learn CSS Grid for free - Výukový kurz CSS Grid.
- Learn CSS Variables for free - Výukový kurz vysvětlující používání CSS proměnných.
- Flexbox Froggy - Hra pro výuku CSS Flexbox
- Grid Garden - Hra pro výuku CSS Grid Layout
- Stack Overflow - Největší diskuzní portál zaměřený na vývojáře. Díky rozsáhlé komunitě je to vhodné místo pro řešení chyb, hledání rad a sdílení svých úspěchů.
- Mozilla Developer Network (MDN) - Webová dokumentace poskytuje informace o otevřených webových technologiích, včetně HTML, CSS a API rozhraní pro webové stránky a HTML5 aplikace.
- Carbon - Generátor obrázků s náhledy kódu.
- CSS Gradient - Interaktivní generátor CSS gradientů. Výsledek je možné exportovat do CSS.
- Gradient CSS Generator - Interaktivní generátor CSS gradientů. Výsledek je možné exportovat do CSS nebo SCSS.
- CSS Grid - Interaktivni generátor pro CSS Grid layout. Výsledek je možné exportovat do CSS.
- Favicon Generator - Generátor favikony webu. Nástroj vám vytvoří HTML kód a přichystá potřebné externí soubory ve správných rozměrech (obrázky, manifesty).
- CodePen - Online editor pro prototypování a snadné sdílení ukázek kódu.
- JSFiddle - Online editor pro testování a sdílení vašeho JavaScriptu, CSS, HTML nebo CoffeeScriptu.
- satyr.io - Generátor prototypů obrázků. Umožňuje vytvářet fiktivní obrázky pevných i náhodných rozměrů, různých barev. Dokáže nasimulovat i pomalé internetové připojení.
- Can I use - Služba poskytuje přehled toho, jak jsou podporovány CSS vlastnosti, HTML5 elementy a jiné webové technologie v různých webových prohlížečích.
- BrowserStack - Služba, která vám umožní vyzkoušet váš projekt na jiných prohlížečích, ale i na jiných zařízeních. Nic nemusíte instalovat. Při testování se připojujete k zařízením přes váš prohlížeč.
- WebPagetest - Online služba pro pokročilou analýzu a testování webů. Umožňuje vývojáři odhalit řadu implementačních problémů např. rychlost a způsob načítání. Více na Vzhůru Dolů…
- Boxy SVG Editor - Webový editor SVG souborů.
- Photopea 🇨🇿 - Volně dostupný grafický editor umožňující editovat v prohlížeči soubory typu
PSD(Adobe Photoshop),XCF(Gimp) neboSketch(Sketch App). - SVGOMG! - Nástroj pro optimalizaci grafických SVG souborů.
- TinyPNG - Nástroj pro optimalizaci grafických PNG a JPEG souborů.
Při vyhodnocování přehledu jsem provedl FB anketu (listopad 2017), kde jsem se tázal komunity na další zajímavé online služby.
- Iconic - Sada ikon navržených pro moderní web.
- IcoMoon - Sady vektorových ikon s možností tvorby
SVG sprite.
- Free Virtual Machines from IE8 to MS Edge - Připravené a volně stažitelné "virtuálky" umožňující spustit Internet Explorer 8 - Internet Explorer 11, popř. Microsoft Edge přes
VirtualBox,Vagrant,VMware,HyperVneboParallels.
Seznam nejoblíbenějších editorů mezi českými frontendisty. Pořadí bylo sestaveno na základě FB ankety z října 2017. V anketě naleznete i další méně užívané editory.
- Praha
- Brno
- Ostrava
- Plzeň
- Barcamp 🇨🇿 - Otevřená konference ze světa internetu. Zaměřena je především na nové trendy v internetových aplikacích a technologiích, webdesign, marketing, internetovou reklamu, digitální média a podnikání. V následujícím seznamu uvádím pouze ty Barcamp konference, které aspoň občas mají v programu zajímavé pro frontend designery.
- Barcamp Brno (2. 6. 2018)
- Barcamp České Budějovice (24. 2. 2018)
- Barcamp Hradec Králové (13. 10. 2018)
- Barcamp Ostrava (24. 11. 2018)
- Barcamp Plzeň (7. 4. 2018)
- Devel.cz 🇨🇿 (16. 6. 2018) - Konference zaměřená na vývojáře. Občas je zde možné najít i přednášku zajímavou pro frontend designery.
- WebExpo (21.–22. 9. 2018) - Největší a nejzajímavější webová událost roku v ČR.
- Vzhůru dolů 🇨🇿 - Vylepšete své znalosti na kurzech autora textů blogu Vzhůru dolů. Spolu s dalšími odborníky pořádá kurzy SVG, Bootstrapu a Javascriptu.
- Frontendisti.cz práce 🇨🇿 - FB skupina určená pro nabídky a poptávky pracovních pozic kolem webovém frontendu.
- StartupJobs 🇨🇿 - StartupJobs vám pomůže najít práci, která vás bude bavit! Portál propojuje zájemce se startupy a skvělými firmami s ambicemi a velkou vizí.
Autor seznamu: Martin Pešout. Dále přispěli: Tomáš Kout, Jetpack, vojtaaa9. Velké díky 🍻 také posílám celé české kodérské komunitě za pomoc s rozšiřováním zdrojů.