DEV Community

bleedeleventh
bleedeleventh

Posted on • Updated on

Front-End Resources

Introduction

This is a collection of (awe)some resources, mostly focused on front-end web development.


API

  • RapidAPI - Free Public APIs for Developers
  • any-api - Documentation and Test Consoles for Over 1400 Public APIs
  • public-apis - A collective list of free APIs for use in software and web development
  • API list - A collective list of APIs
  • free-open apis - 30 Free & Open APIs for Marketers & Content Developers
  • json placeholder - Free fake API for testing and prototyping

Data-Structures-and-Algorithms

Algorithm-Challenges

Algorithm-Books

Algorithm-Websites

Design

Design-Articles

Design-Books

Colors

Design-Systems

Fonts

Icons

Optimization Tools

Stock Photos-Illustrations-Mockups

Tools-for-Responsive-Design

  • MY DEVICE.io a tool for responsive design, browser features

Tools

  • 10015 - All Online Tools in “One Box”
  • Contrast - a tool for contrast checker

Typography

Design-Websites


HTML

Accessibility

HTML-Articles

Checklist

Performance

Validation

HTML-Websites


CSS

CSS-Articles

Architectures-Methodologies

CSS-in-JS

CSS-Design-Systems

CSS-Generators

CSS-Videos

CSS-Websites


Front-End-Resources

Front-End-Articles

Front-End-Challenges

Front-end-Surveys

Front-End-Websites

Git&Github

Git-Courses

Git-Videos

Git-Websites

Git-Tools

  • lazygit simple terminal UI for git commands

JavaScript

JavaScript-Articles

JavaScript-Books

JavaScript-Conference-Talks

JavaScript-Courses-Practices

JavaScript-Tools

- Babel

JavaScript-Websites


React

React-Articles

React-Frameworks

React-Hooks

React-State-Management

React-Tools


TypeScript

TypeScript-Articles

TypeScript-Courses

TypeScript-Challenges

TypeScript-Tools

Other-Content

Blogs

Other-Books

Code-Formatters

Developer&Productivity-Tools

  • Raycast - Spotlight with super powers with lots of awesome extensions.
  • Snipetty - Tool for developers to create code snippets.
  • Polypane - Development focused browser for building apps and refactoring.
  • React Developer Tools - Chrome extension for React Development.
  • Thor - Easy switch between apps by custom shortcuts.
  • AltTab - Customize your alt-tab settings deeply.
  • xScope - Great tool for both design and development.
  • Sip - Color picker for Mac OS.
  • RainDrop - Bookmark manager.
  • Github Copilot - Your AI pair programmer.
  • WakaTime - Track your time in both browser and IDE.
  • GitKarken - Git GUI & Git CLI with a lot of features.
  • DevBook - Search through the DevDocs and StackOverflow without switching to your browser.
  • daily.dev - Great tool for finding hottest trends and popular articles.

Discord Communities

Documentations

- TypeScript Documentation

Interactive-Games

Interview Practices

System Design

Newsletters

Podcasts

Reddit-Subreddits

Roadmaps

Online-Curriculums

Youtube-Channels

Mixed-Content

Videos

Youtube Channels

Top comments (25)

Collapse
 
jairo1031 profile image
Jay Rodriguez

Please consider this tool. I think it's highly beneficial and worth if for any frontend developer. Is has tons of tools for free in one single place. I think they've done a great job at putting this site together and all of the resources in one place.

(10015.io/)

Collapse
 
bhavyakhandrika profile image
Bhavya Sri Khandrika

Thank you for your effort. I went through the content of your article and I am surprised to find all the resources at one place. 🤝🤝😁

Collapse
 
aycanogut profile image
bleedeleventh

Don't forget to star on Github :p Thanks!

Collapse
 
reng99 profile image
call me R

Thanks. Bro.

Collapse
 
fumaga_xyz profile image
Fumagalli

Great article!

Collapse
 
aycanogut profile image
bleedeleventh

Happy to help

Collapse
 
sirsonge profile image
Jason’s

感谢分享 谢谢!

Collapse
 
jpfingsten profile image
Jasmine Pfingsten

This is awesome! I'm where you were a year ago and so excited to have all these resources rounded up in one place. Thanks!

Collapse
 
aycanogut profile image
bleedeleventh

Happy coding Jasmine! :)

Collapse
 
chrisasek profile image
Chris Asek

Thanks, this is awesome!

Collapse
 
tech-foutraque profile image
tech foutraque

Hello ! If you're a frontend developer, I also recommend my newsletter. Every Monday you'll find frontend news, UX/UI articles, tools and more.
techfoutraque.hashnode.dev/

Image description

Collapse
 
aycanogut profile image
bleedeleventh • Edited

Oh, sorry. Its impossible to maintain links from here because its a dynamic list. So i will try to post on listings section.

Edit: I don't have any credits lol. Okay, I will move the list to the post, its better than nothing.

Collapse
 
jairo1031 profile image
Jay Rodriguez

Can you please include this site called 10015.io. I noticed your from Turkey and the founder and creator of this awesome site is also Turkish. I learned about it on a LinkedIn post and its super cool and useful.

Collapse
 
sittisukintaruk profile image
Sitthisak Intharak

Oh this is treasure. Thx man !! :)

Collapse
 
aycanogut profile image
bleedeleventh • Edited

Glad to help!