Resources for developers by Esteban

This is a list of resources and tools that I have been using in my job as developer or I think that can be helpful. It will be updated each time that I find new resources.

Animations

To build CSS animations or prebuild animations

animista.net — A set of animations for your web apps
Cubic-bezier — It's a tool to customize your animations
Keyframes.app — Another tool to customize your animations

API

A set of resources or pages with APIs to use in your projects

Public APIs — A page with a lot of APIs to use in your projects

Architecture

A set of resources about design patterns and architecture

Awesome Software and Architectural Design Patterns — A repo with a list of articles about software and architectural design patterns

Backend

A set of web pages, libraries, and tools to work with Backend

fl{/} — A site to deploy a backend app for free

CSS

A set of web pages, libraries, and tools to work with CSS

CSS Loaders — A page with a lot of loaders made with CSS
Glassmorphism CSS Generator — A tool to generate a glassmorphism effect on your web apps
OPEN PROPS — A CSS library that it uses CSS variables

Design

A set of webs and tools to help you with your designs

coolors — A page to help you to choose a color palette for your projects
dribbble — A page to get design inspiration of your projects
Landingfolio — A page to get design inspiration of your projects
LOGO — A page to generate a custom logo for your projects
penpot — A tool to make the design of your project

Documentation

You can find different webs with documentation of different technologies

CSS-TRICKS — A site with a lot of articles about HTML, CSS and Javascript
DevDocs — A site with a lot of documentation about different technologies
Questions for React Interview — A git repository with a lot of answers to questions in a React interview
MDN — Most complete and update documentation about HTML, CSS and JavaScript
MANZ.DEV — A spanish site where you can find articles about frontend development
roadmap.sh — A site where you can find roadmaps to learn the different fields of programming

Frontend

A set of web pages, libraries, and tools to work with Frontend

Frontend Mentor — A web with a lot of projects to practice your frontend skills
Frontend Practice — A web with a lot of projects to practice your frontend skills
iCodeThis — A web with a lot of projects to practice your frontend skills

HTML

A set of web pages and tools to improve your knowledge about HTML

HTML Really — A set of questions about Advanced HTML to measure your knowledge level about it

Icons

A set of webs with a lot of free icons for your projects

Images

A set of webs with a lot of free images for your projects and tools to edit them

Pexels — A web with a set of images for your projects
Storyset — A web with a set of images for your projects
SVGOMG — A tool to optimize and minify SVG files
Squoosh.app — A tool to optimize and minify all kind of images files

Javascript

A set of tools and libraries to implement with Javascript

33 Concepts Every JavaScript Developer Should Know — A git repo where you can find info about 33 important concepts of javascript
Eloquent JavaScript — A site to learn javascript and a lot of exercises
Filepond — A javascript library to implement a Drag & Drop file input with frameworks adapters as Angular, Vue or React
vanilla-tilt.js — A javascript library to implement a smooth 3D tilt

Nodejs

A set of webs and software for NodeJS development

Nodejs Toolbox — A web with a lot of tools for Nodejs development
Node School — An utility to learn about NodeJS

Presentations

You can find different webs or resources to build your presentations

Slidev — A library to create presentations using Markdown
impress.js — A library to create presentations using HTML, Javascript and CSS

Programming Logic

A set of webs with a lot of exercises to improve your programming logic

AdventJS.dev — A site with a lot of Javascript exercises with different levels
devChallenges — A site with a lot of exercises with different levels
edabit — A site with a lot of exercises with different levels and for different languages
Exercism.org — A site with a lot of exercises with different levels and for different languages
Javascript Algorithms and Data Structure — A repo with a lot of explanations of algorithms and data structures in javascript
Refactoring Guru — A site where you can find design patterns for developing and refactoring
The Algorithms — A site with a lot of algorithms for Javascript

React

A set of webs, libraries, and tools to work with them in your Reactjs projects

Framer motion — A library to implement animations with javascript on Reactjs
React DayPicker — A library to implement a day picker on a Reactjs app
React Hot Toast — A library to implement customizable toasts on a Reactjs app
React Router — A library to implement routing on a Reactjs app. Also, it have some interesting methods to extend functionality
Sonner — A library to implement a tooltip on Reactjs
Tanstack Query — A library to implement a state manager that can be synchronized with backend on Reactjs app
UseAnimations — A library to implement micro animations on a Reactjs app

SEO

A set of webs and tools to handle the SEO on your pages

Social Share Preview — A tool to help you to identify if your site can be shared in social networks

Web

A set of tools to help you to implement some features on your web apps

Dropzone — A library to implement drag and drop in your apps
HeadlessUI — A set of components without styles for your projects
Omatsuri.app — A set of tools to help you on web development
UIBALL — A web with a set of loaders for your web. You can use with only HTML and CSS or as a React component
UI Goodies — A web with a set of resources for your web. Icons, images, fonts, illustrations, etc

Other

Other interesting pages

Random Dad jokes — A page that gives you dad jokes

That is all.