My Developer Resources

View this readme in notebook form

View this readme file with nicedoc

Table of Contents

• Directories and Collections
• Tailwind
• Icons
• Fonts
• Tools
• Color
• Images
• Guides and Tutorials
• Cheatsheets
• Webpage Testing
• Other

Directories and Collections

PersonalSit.es

• ⚡️ 📇 A little directory of people's personal sites

Awesome Tech Blogs

• ⚡️ This is a list of Awesome Tech Blogs

Uses /Tech

• ⚡️ A list of /uses pages detailing developer setups, gear, software and configs

Awesome GitHub Profile Readme

• ⚡️ A great curated collection of GitHub users profile readmes, great for ideas

JS.coach

• ⚡️ JS.coach is a manually curated list of packages related to React, Webpack, Babel and PostCSS

Awesome Search

• ⚡️ Searchable database of all awesome lists on github

free-for-dev

• ⚡️ This is a list of software (SaaS, PaaS, IaaS, etc.) and other offerings that have free tiers for developers.

---

[Table of Contents]

Tailwind

Tailwind CSS Starter Kit

• ⚡️ A library of components made with Tailwind CSS to bootstrap your projects

Tailwind UI Kit

• ⚡️ Tail-kit gives you access to over 250 free components and free templates, based on Tailwind CSS 2.0. It's all compatible with React, VueJS and Angular application

Tailwind Components

• ⚡️ This is a free repository for community components using Tailwind CSS. There are various components like 404 pages, Notification dropdown, eCommerce product list page, and so many other components.

Headless UI

• ⚡️ Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

Tailwind Typography

• ⚡️ This is an amazing website that you can check how your typography will look like before you actually code it. You can select the font family of your titles and text body to see if they match to your liking.

Tailblocks

• ⚡️ This amazing project was created by Mert Cukuren, it has over 60+ UI blocks build with Tailwind are ready to use. Just click on the view code button and copy the code to your file.

Tailwind Run

• ⚡️ This is like a live code editor for creating Tailwind UI blocks on the go. It's like using the Codepen but has Tailwind added for you already.

---

[Table of Contents]

Icons

Line Icons

• ⚡️ 2000+ Line Icons for Designers and Developers. Handcrafted Line Icons for Modern User Interfaces of Web, Android, iOS, and Desktop App Projects.

Icon Finder

• ⚡️ Search through 5,416,656 SVG or PNG icons

GlyphSearch

• ⚡️ Search for icons from Font Awesome, Glyphicons, IcoMoon, Ionicons, and Octicons

React Icons

• ⚡️ Include popular icons in your React projects easily with react-icons, which utilizes ES6 imports that allows you to include only the icons that your project is using.

Feather Icons

• ⚡️ Collection of over 260 icons with adjustable size, width and color

Simple Icons

• ⚡️ 1872 Free SVG icons for popular brands

Bootstrap Icons

• ⚡️ Free, high quality, open source icon library with over 1,300 icons. Include them anyway you like—SVGs, SVG sprite, or web fonts

Primer Octicons

• ⚡️ Githubs primer octicons in various sizes

Eva Icons

• ⚡️ Eva Icons is a pack of more than 480 beautifully crafted Open Source icons for common actions and items

Font Awesome

• ⚡️ Get vector icons and social logos on your website with Font Awesome, the web's most popular icon set and toolkit

Cryptocurrency Icons

• ⚡️ A set of 449 crypto and fiat currency icons. Completely free

Evil Icons

• ⚡️ Simple and clean SVG icon pack with the code to support Rails, Sprockets, Node.js, Gulp, Grunt and CDN

Material Icons Guide

• ⚡️ An overview of material icons—where to get them and how to integrate them with your projects

icones

• ⚡️ Icon Explorer with Instant searching, powered by Iconify Icon Explorer with Instant searching, powered by Iconify

---

[Table of Contents]

Fonts

FontCDN

• ⚡️ Search tool for Google Fonts

Nerd Fonts

• ⚡️ Iconic font aggregator, collection, and patcher

---

[Table of Contents]

Tools

Github Metrics

• ⚡️ 📊 An image generator with 20+ metrics about your GitHub account such as activity, community, repositories, coding habits, website performances, music played, starred topics, etc. that you can put on your profile or elsewhere!

Open Graph Image

• ⚡️ This is a service that generates dynamic Open Graph images that you can embed in your tags

faven

• ⚡️ Great tool to upload your image, then creates all favicon sizes for your website to download along with code

emoji-translate

• ⚡️ 📚 Translate text to ✨emoji ✨!

emojillate

• ⚡️ 📷🎨 Pixellate an image into emoji

Favicon Grabber

• ⚡️ Grabbing favicons from any domain

Faviator

• ⚡️ A simple easy favicon generator

Favycon

• ⚡️ A small online tool to help you generate your favicon in all the sizes and formats you need

---

[Table of Contents]

Color

Gradient Designer

• ⚡️ You can select different colors that you want to use (up to 3 colors) and choose the direction you want the gradient to go to and from. After that, the code is generated for you and you can copy it to your code in your editor.

UI Gradients

• ⚡️ 🔴 Beautiful colour gradients for design and code

Colorbook

• ⚡️ 🎨 Color schemes for UI design - Optimized for foreground, background, border, etc.

Copy Palette

• ⚡️ 💆‍♂️ Hassle-free export your palette to SVG format

---

[Table of Contents]

Images

unDraw

• ⚡️ Open-source illustrations for any idea you can imagine and create.

[cssFilters]

• ⚡️ 🌄 Custom and Instagram like photo filter playground for CSS built with React

---

[Table of Contents]

Guides & Tuturials

Js Tips

• ⚡️ JS Tips is a collection of useful daily JavaScript tips that will allow you to improve your code writing

Javascript info

• ⚡️ The Modern JavaScript Tutorial. How it's done now. From the basics to advanced topics with simple, but detailed explanations

Javascript Cheatsheet

• ⚡️ Amazing guide to Javascript and all its coding examples, complete with menu

1 Line of code

• ⚡️ 244 Favorite JavaScript Utilities in single line of code!

---

[Table of Contents]

Cheatsheets

CSS Cheatsheet

• ⚡️ Great CSS cheatsheet

Javascript Cheatsheet

• ⚡️ Amazing guide to Javascript language with coding examples and guides, complete with sidebar menu

React Typescript Cheatsheet

• ⚡️ Cheatsheets for experienced React developers getting started with TypeScript

ES6 All The Things

• ⚡️ Collection of ES6 goodies for next-level dev 🤓💻

Python Cheatsheet

• ⚡️ Amazing guide to Python language with coding examples and guides, complete with sidebar menu

Vue Cheatsheet

• ⚡️ Great Vuejs cheatsheet in a docs format with many links and examples

Chakra UI Cheatsheet

• ⚡️ Great cheatsheet for Chakra. Overall layout and structure displayed in bold colors

OverAPI

• ⚡️ Collecting All Cheat Sheets

Awesome Cheatsheets

• ⚡️ 👩‍💻👨‍💻 Awesome cheatsheets for popular programming languages, frameworks and development tools. They include everything you should know in one single file

---

[Table of Contents]

Webpage Testing

CSS Stats

• ⚡️ CSS Stats provides analytics and visualizations for your stylesheets. This information can be used to improve consistency in your design, track performance of your app, and diagnose complex areas before it snowballs out of control.

Responsinator

• ⚡️ Responsinator helps website makers quickly get an indication of how their responsive site will look on the most popular devices.

Google Rich Results Test

• ⚡️ Test your publicly accessible page to see which rich results can be generated by the structured data it contains.

Google PageSpeed Insights

• ⚡️ PageSpeed Insights analyzes the content of a web page, then generates suggestions to make that page faster.

MX Lookup Tool

• ⚡️ A great toolbox of various diagnostic, dns, domain, blacklist tools.

Other

sButtons

• ⚡️ Simple and Creative buttons with sButtons

---

[Table of Contents]