Resources
Javascript
Typescript
- https://decipher.dev/30-seconds-of-typescript/ : 30 seconds of typescript (hooks, snippets, more)
libraries
- https://videojs.com/ : HTML5 video player library
- https://tempo.formkit.com/ : date library
- vanilla js libraries
React libraries
These are my references:
- https://github.com/CopilotKit/CopilotKit : Ai Copilot for SAAS product
- REact DND : React drag and drop library
- https://github.com/Nozbe/WatermelonDB : WatermelonDB, a SQLite abstraction for REact and React Native
- https://github.com/segmentio/evergreen : Evergreen UI library, including file uplaoder
- https://github.com/vercel/react-tweet : React tweet component
- https://react-svgr.com/playground/ : SVG to React component
- https://mantine.dev/ : React UI library
- https://usehooks-ts.com/ : React Typescript hooks
CSS
TOols collection
- https://gradients.app/en : CSS tools collection
- https://keyframes.app/ : CSS tools collection
- https://10015.io/css-tools : CSS tools collection
- https://www.cssportal.com/ : CSS tools collection
- https://designjunction.xyz/ : Free design assets
- https://www.fffuel.co/ : CSS tools collection
- https://uiverse.io/ : CSS and tailwind tools collection
- https://github.com/goabstract/Awesome-Design-Tools : design tools repo
- https://github.com/bradtraversy/design-resources-for-developers : design tools repo
CSS tools
- glassmorphism css generator
- https://hype4.academy/tools/glassmorphism-generator : glassmorpshism creator
- https://shadows.brumm.af/ : Multilayered shadow generator
- https://neumorphism.io/#e0e0e0 : Neumorphism generator
- https://cssbuttons.app/ : CSS button generator
- https://cssbud.com/css-generator/css-glow-generator/ : CSS glow generator
- https://gradients.app/en/mesh : CSS gradient choices
- https://cssgradient.io/gradient-backgrounds/ : CSS gradient backgrounds
- https://www.cssportal.com/css-loader-generator/ : CSS loader generator
- https://animate.style/ : CSS animation choices
- https://tobiasahlin.com/spinkit/ : CSS loader choices
- https://github.com/IanLunn/Hover : CSS hover effects stylesheet
- https://cssgrid-generator.netlify.app/ : CSS grid generator
- https://9elements.github.io/fancy-border-radius/ : CSS border radius generator
- https://scrollbar.app/ : CSS scrollbar styling
- https://uiverse.io/loaders : CSS loader generators
- https://cssfx.netlify.app/ : free CSS animations and effects
- https://cubic-bezier.com/#.17,.67,.83,.67: CSS Cubic Bezier Tool
SVG generator tools
- https://haikei.app/generators/ : All in one SVG curves and blobs generator
- https://angrytools.com/blob-generator/ : blob svg generator
- https://coolbackgrounds.io/ : cool svg backgrounds
- https://getwaves.io/ : SVG wave generator
- https://tabbied.com/ : SVG pattern doodles
- https://app.haikei.app/ : SVG curves
- https://www.shapedivider.app/ : SVG curves for hero section
- https://svgwave.in/ : SVG waves
- https://www.svgshapes.in/ : SVG shapes
- https://svgcrop.com/ : Crop your SVGs
- https://favicon.io/ : favicon generator
- https://boringavatars.com/ : SVG avatars
- https://www.svgbackgrounds.com/ : SVG graphics collection
- https://marvelapp.github.io/devices.css/ : CSS phone mockups
- https://undraw.co/illustrations : SVG illustrations
- https://doodleipsum.com/ : SVG illustrations
- https://getavataaars.com/ : SVG avatar generator
- https://3dicons.co/ : 3d icons
- https://storyset.com/ : SVG illustrations
- https://shapefest.com/ : 3d SVG illustrations
Utilities
Tools Suite
These websites have all-in-one solutions to many problems:
- https://allinone.tools/ : video, image, code, etc.
- https://it-tools.tech/ : open graph, decoding, etc.
- https://app.lazyweb.rocks/ : search for tools
- https://cheatography.com/ : cheatsheets for everything
Images
- AI image upscaler
- image compressor: SQUOOSH
- Screely : add backgrounds to your screenshots
- resize images
- Remove watermark
- Remove background from images
- Remove unwanted things from iamge
- Image upscaler
- Remove background from image
Video
APIs
- https://apivault.dev/ : API marketplace
- https://apipheny.io/free-api/ : free apis
- https://dog.ceo/api/breeds/image/random : free dog image
Code
- https://transform.tools/js-object-to-json : converts code from one language to another.
- https://ray.so/ : code screenshotter
- https://carbon.now.sh/ : code screenshotter
- https://playcode.io/new : code playground
- http://knutsynstad.com/fauxcode/ : code screenshotter for fake code
AI TOols
- https://www.warp.dev/ai : command line AI agent
- https://aider.chat/ : AI copilot in terminal
- https://leonardo.ai/ : AI image generation
Other
- https://markdowndown.vercel.app/ : Convert webpages into markdown
- https://selfh.st/apps : self hosted apps
- https://smallpdf.com/ : edit PDFs
- https://www.tldraw.com/ : free whiteboard app
Learning
- CSS cheatsheets : CSS cheatsheets
- learn typescript from this repo
- functional programming js guide
- you don't know JS github series
- Learn HTML DOM
- Learn debugging
- JS cheatsheet
- Learn CSS animations blog
- Best roadmaps
- Free programming books
- Learn software design pattern
- Learn through creating impressive projects
AI learning
Various collections of stuff
Useful articles
- https://www.joshwcomeau.com/blog/how-to-learn-stuff-quickly/
- https://www.joshwcomeau.com/css/stacking-contexts/