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 (21)

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
 
fumaga_xyz profile image
Fumagalli

Great article!

Collapse
 
aycanogut profile image
bleedeleventh

Happy to help

Collapse
 
reng99 profile image
call me R

Thanks. Bro.

Collapse
 
sirsonge profile image
Jerry's

感谢分享 谢谢!

Collapse
 
lukeshiru profile image
Luke Shiru • Edited

The Content Policy of DEV states that:

Posts must contain substantial content — they may not merely reference an external link that contains the full post.

Please, share the links here or use the listings option if just want to just promote.

Edit: Thanks for putting the links here.

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
 
chrisasek profile image
Chris Asek

Thanks, this is awesome!

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
 
sittisukintaruk profile image
Sitthisak Intharak

Oh this is treasure. Thx man !! :)

Collapse
 
aycanogut profile image
bleedeleventh • Edited

Glad to help!

Collapse
 
peopledatabase profile image
People Database

Great list, thanks :)

Collapse
 
davidmariolc profile image
DavidMarioLC

Thanks!

Collapse
 
harish_calvin profile image
harish calvin

wow, Thanks it's awesome.

Collapse
 
cyph3r57 profile image
cyph3r57

Great job, congratulations and thanks👌👌👏👏

Collapse
 
alessan34732291 profile image
deste_x04

bro if you want consider this website BoxCoding

Collapse
 
moniv9 profile image
Mohit Verma

To prepare for your frontend/javascript interview. You can look at this ebook I created with collections of commonly asked frontend questions with solution.

mohit8.gumroad.com/l/ygass

Collapse
 
austincoleman profile image
Austin Coleman

I thought this CSS course was fantastic: youtube.com/watch?v=OXGznpKZ_sA