ofarukcaki / Web-Resources

Collection of React resources for Full-Stack development
10 stars 9 forks source link

Web-Resources

What is this repo for:

This repo is created for saving resources we found useful by to date. Mostly contains React and Web development resources.

Resources:

Tools

Mozilla Developer Tools
Request Catcher - rest/webhook
Beeceptor - Rest API Mock Server
Webhook Tester
Insomnia - Rest Client
Node.js Process Manager
svgator (paid)
Screly - Web mockup generator

Authentication

Passport.js - Node.js Authentication
Firebase - Google's Authentication Solution

Design

Web Gradients - Gradient Colors for Web
SweetAler2 - Colorful Alert Boxes
Background based on two dominant color
Adaptive Backgrounds
Trianglify - algorithmically generated triangle art
Dribbble - Professional themes, fonts, templates
Ant Design
2 Color Combinations
Goodpalette - Make beautiful color palettes for UI.

CSS

Yoga - layouts for any platform
ButterCake CSS
Web Animation Tools
Awesome Buttons
Hover Buttons
Loaders - Css
Very Coll Button Effects
Web UI Kit
shine.js - pretty shadows
Fitty - Fit Text to inside it's Parent Image Blur Plugin
Parallax
Epic Bootstrap
CSS Hover link animations
Eva Icons
Feather Icons
Tilda Icons 700+
Pretty CHeckboxes
Bootbox - Alerts, toasts etc.
Transferwise Bootstrap
Creative Buttons
Animista - CSS Animations on Demand
Pure & Simple CSS Text Shadows
CSS Grid Experiments
Bulma
Beautiful Box Shadows

Terminal

Cmder
Hyper

React

Hot Loader for create-react-app
Gatsby - Static Site Generator
Monocle - Visualizing Tool for React
next.js - Documentation
Material Design spinner components for React.js
HTML to JSX
Unstated - React State Management
ReactSpring - React Animations
UseHooks - Easy to understand React Hook recipes
Chakra UI - A simple, modular and accessible component library
formerly Material-UI
Jotai - Primitive and flexible state management for React
zustand - A small, fast and scalable bearbones state-management
Radix UI - Unstyled React components for building UI

Databases

WatermelonDB - Database for Easy User Data Interaction
Prisma - Build a GraphQL server with any database

Design

Airbnb Rules for JS
Nerd fonts
CSS Cheatsheet
Icon repository
Khroma - Colors, gradients
ColorSpace - Never waste Hours on finding the perfect Color Palette again!
CoolHue - Gradients
Color Gradient Generator
Unsplash - Free Stock Photos
Paletton - Color Palette
Icons
Blobmaker - Otganic SVG shapes
Hero Patterns - SVG background patterns
Colors & Fonts
Hue.tools
Magic Patterns

Stacks

mern.io - Easily build production ready universal apps

Animation

Simple libraries for delightful interfaces
Standalone parallax scrolling for mobile and desktop with CSS variables Transition Animation
Mo.js - Motion for the web
ScrollReveal
React Animations
Lax.js Animation Library
React Animations
Lottie
SVG Aniamted Loaders

Awesome

33 JavaScript libraries and frameworks to check out in 2018
15 Interesting JavaScript and CSS Libraries for August 2017 10 Amazing CodePen Demos for April 2018

Vectors, Stock Photos, Icons, etc.

https://worldvectorlogo.com/
http://www.flaticon.com
https://www.iconfinder.com/
https://www.pexels.com/
https://unsplash.com/
https://pixabay.com/

Security

Mobile

pulltorefresh.js
UI Kitten - RN UI Kit
Nachos UI Kit - RN UI Kit

Blogs

An Easy Way to Get Started with the MERN Stack
Securing fucking MongoDB
UI toolkit for React Native
HQ React tuts. Nextjs mostly

Other

Inspect Requests
Chocolatey - packacge manager for Windows
Node version & feature checker
Concurrently - run multiple commands
three.js - 3D Animations
Single Page Website Showcase
The Top JavaScript Trends 2018
push.js - desktop notifications
Drag and Drop
list.js - list, search & sort
birdview.js - website zoom out
Easy communication between cross-origin browser tabs
Shepherd - Guide your users through a tour of your app
Shotsnapp - Mobile mockup generator
Sweet Alerts
nth master
codyhouse ****
Animated 404 Pages
Epic Spinners
Next.js Auth Example Snippet
Codepip Games (tutorials)
Refactoring.guru
Friendly web development tutorials for complete beginners

Tailwind

UI components for React/Tailwinds
Tailblocks - Ready to use tailwind blocks
Meraki UI - Support RTL Languages & Fully Responsive Based On Flexbox & CSS Grid With Elegant Dark Mode
Kitwind - Fully responsive UI kits
Tailwind kit - Components and templates

Vue

Vue Material

Testing

Cucumber Boilerplate
Jest
Node.js template for end-to-end testing with Cucumber.js and Puppeteer


Utils

Free Form Builder (like typeform)
Cheat sheets
Free Landing Page Templates