FRONTEND.md

Front-end Resources

Learn JavaScript

• MDN JavaScript Guide
• ECMA Script 6
• You Don't Know JS
• Super Hero JS
• JavaScript Algorithms & DataStructure
• JS Tips

Learn CSS

• Flexbox Froggy - A game for learning CSS flexbox
• CSSCursor - List of Available Cursor

JavaScript Frameworks

• AngularJS
• Angular
• Ember
• Backbone
• VueJS

UI Frameworks

• Bootstrap
• Foundation
• Material Design Lite
• MaterializeCSS
• MUI
• Angular Material
• Angular Material 2
• PrimeNG

JavaScript Libraries

---These libraries doesn't/less interact with the DOM.

• Lodash - Utility Library
• is.js - Check Types, RegExps, Presence, Time and More...
• D3 - Visualization Library
• VisJS - Visualization Library
• ClipBoardJS - Copying to Clipboard
• Push.js - Desktop Push Notification
• Tesseract - Extract Text from Image (OCR)
• ColorTheif - Extract Colors from Image
• PaperJS - Vector Graphics Scripting

UI Libraries

--- These libraries manipulate or modifies the UI and its behavior.

JavaScript

• React - View Rendering
• jQuery - Dom Manupulation and Lot Other Stuff
• NodeList - Dom Manupulation
• RetinaJS - Retina Graphics Management
• onScreen - Scrolling Helper
• WayPoints - Scrolling Helper
• Perfect Scrollbar - Custom Scrollbar
• Skrollr - Parallax Scrolling
• DropzoneJS - Drag & Drop File Upload
• SortableJS - Drag & Drop Sorting
• CropperJS - Cropping Tool
• MixItUp - Animated Filtering, Sorting and More...
• intro.js - Step by Step Site Introduction
• Echo - Image Lazy Loading
• ckEditor - WYSIWYG Editor
• Tether - Advanced Position
• MapKit - Map Builder
• Leaflet - Interactive Maps
• SoundManager2 - Audio Player
• WaveSurfer - Audio Waveform Visualization

jQuery

• Cycle2 - Image Slider
• RangeSlider.JS - Range Slider
• jQuery Easing - Easing Plugin

Angular

• ng2-dnd - Drag & Drop
• ng2-retina - Retina Graphics Management
• ngx-charts - D3 Visualization Framework
• Angular Resizable - Resizable Component

Animation/Effect Libraries

--- These libraries provide awesome animations & effects.

JavaScript

• WOW.js - Reveal Animations When Scroll
• Odometer - Smooth Number Transitioning
• FreezeFrame - Pauses Animated .gif
• AniJS - Animation Library
• BounceJS - Animation Builder
• Animatic - Efficient Animator
• MatterJS - Physics Based Animations
• DynamicsJS - Physics Based Animations
• Turn.js - Flip Book Effect
• DynCSS - Dynamic CSS Rules
• Typed.js - A JavaScript Typing Animation Library

CSS

• animation.css - Collection of CSS Animations
• CSS Animation - Collection of CSS Animations
• Magic Animations - Collection of CSS Animations
• CSS Shake - Collection of Shaking Animation
• CSS Loaders - Collection of Loaders/Spinners for Loading Screen
• SpinKit - Collection of Loaders/Spinners for Loading Screen

Fonts & Icons

• Google Fonts
• Material Icons
• Font Awesome
• Flat Icon
• Ico Font
• Mono Social Icons Font

Tools

• Gulp - Worlflow Automation
• Grunt - Worlflow Automation
• Webpack - Module Bundler
• RollupJS - Module Bundler
• Angular CLI - CLI tool for Angular
• JSON Server - Mocking Backend with JSON

Web Apps

• TinyPNG - Image Optimizing Tool
• Juntoo - Feedback Manager
• Crowdin - Localization Management Platform
• JSPerf - JavaScript Performance Playground
• Mockaroo - Realistic Data Generator
• Tridiv - CSS 3D Editor
• Real Favicon Generator - Favicon Generator
• App Manifest Generator - App Manifest Generator for PWA