frontend-resources

LEARNING

Learning Resources

• Cheatsheets a modest collection of cheatsheets
• Frontend Performance an exhausted list of elements you should check or at least be aware of
• Web Developer Roadmap the paths that you can take and the technologies that you would want to adopt in order to become a frontend, backend or a devops.
• Superhero.js A stylish list of online resources to learn and understand the basics of JavaScript (ES5), how to organize code, which tools to use, etc. A very good starting point for the beginner and intermediate frontend developer.
• JavaScript the right way Another resource for beginners and intermediate developers.
• You don't know JS A free series of books on JS. A little dated, but still worth a read.
• Eloquent JavaScript A beginner-friendly resource from which even the experienced developer might learn a thing or two.
• Modular JavaScript Book Series "An open effort to improve our collective understanding of writing robust, well-tested, and modular applications"
• Web-Skills A visual overview of useful skills to learn as a web developer

Magazines

• medium Back-end to front-end.
• Hackernoon How hackers start their afternoon.
• freeCodeCamp Stories about development, design and data science.
• techcrunch The javascript news stream from techcrunch.
• SmashingMagazine For web designers and developers.
• CSS tricks Lots of tricks in css.

Newsletter

• Codrops Collective The Collective features the latest news and resources from the web design & web development community.
• Sidebar Since 2012, Sidebar has been collecting the best links about UI design, typography, CSS, user research, and all other facets of design.
• Web Development Reading List A handcrafted, carefully created weekly update resource for web developers by Anselm Hannemann, founder of Colloq.
• ES6.Next News Weekly newsletter curated by Dr. Axel Rauschmayer

Online Courses

• CSS Grid (FREE!) learn CSS Grid with Wes Bos in 25 pretty good videos
• Javascript30 (FREE!) 30 Day Vanilla JS Coding Challenge
• What TheFlexBox?! (FREE!) a simple, free 20 video course that will help you master CSS Flexbox!
• Udemy

Podcasts

• SyntaxFM A Tasty Treats Podcast for Web Developers by Wes Bos and Scott Tolinski
• CSS Podcast All about CSS with Una Kravets and Adam Argyle, Developer Advocates from Google
• Shoptalk Show A podcast about building websites
• Toolsday A show by Una Kravets & Chris Dhanaraj about the latest in tech tools, tips, and tricks on Tuesdays at 2
• programmier.bar Wollt ihr mehr über Progressive Web Apps, CSS Grids, TypeScript oder andere spezifische Themen der Web- und App-Entwicklung erfahren? Dann hört rein in unseren Podcast!

Tech Tutorials

• CSS Grid a guide to learning CSS grid by @jonsuh
• Grid Garden A playful intro to CSS grid.
• Flexbox a complete illustrated Flexbox tutorial
• Flexbox Froggy A playful intro to CSS flexbox.

DOING

Essentials

• Can i use? Can i use this or that in this or that browser? Maybe. Take a look.

Browser Extensions

• Awesome Screenshot screen capture & image annotation too
• EditThisCookie add, delete, edit, search the cookies on your page
• Lighthouse automated tool for improving the performance, quality, and correctness of your web apps
• PerfectPixel put a semi-transparent image overlay over the top of the developed HTML
• Web Developer nice outlining for different element types, for example
• Page Ruler measure elements on any web page
• VisBug "FireBug for designers"

Tools and Utilities

• Postman working with url endpoints, simulate APIs
• Insomnia REST Client powerful and easy tool for api calls
• OBS - Open Broadcaster Software easy screen recording

UNMAINTAINED

• Web Love with Una the personal (monthly-ish) newsletter of Una Kravets, filled with tiny bits of web love and inspiration.
• JS Air Seems to be dead, but the available episodes are quite good.