Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the front-end development resources that save development time?

2025-01-15 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

What are the front-end development resources that save development time? I believe many inexperienced people are at a loss about this. Therefore, this paper summarizes the causes and solutions of the problem. Through this article, I hope you can solve this problem.

This list contains many kinds of resources, so I'll group them here.

Javascript library

Particles.js  -  a library for creating cool floating particles in web

Three.js  -  a library for creating 3D objects and 3D spaces in web

Fullpage.js-   quickly realizes full-screen scrolling characteristics

Typed.js  -  typewriter effect

Waypoints.js  -  triggers a function when scrolling to an element location

Highlight.js  -  web syntax highlight

Chart.js  -  uses JavaScript to create beautiful charts

Instantclick  -  can significantly accelerate the loading time of the website, and preload resources when using the mouse hover.

Chartist  -  another chart library

Motio  -  a sprite image library based on animation and translation

Animsition  -jQuery plug-in for   CSS to realize animation transition

Barba.js  -  streaming page transition

TwentyTwenty  -  a visual diff tool for comparing pictures

Vivus.js  -  animates on SVG

Wow.js  -  shows animation when scrolling

The Scrolline.js  -  page shows scrolling progress as it scrolls

Velocity.js  -  fast and smooth JavaScript animation

Animate on scroll  -  beautiful page scrolling element animation

Handlebars.js  -  Javascript template

JInvertScroll  -  parallax scrolling

One page scroll  -  another page scroll library

Parallax.js  -  parallax engine that responds to changes in the direction of smart devices

Typeahead.js  -  search completion

Dragdealer.js  -  cool drag and drop

Bounce.js  -  creates cool CSS3 animation

Pagepiling.js  -  full screen scrolling

Multiscroll.js  -  two columns scroll vertically in the opposite direction

Favico.js  -  dynamic favicon

Midnight.js  -  fixed head switching effect

Anime.js  -  Animation Library

Keycode  -  gets the JavaScript keycode of keyboard keys

Sortable  -  drag and drop plug-in

Flexdatalist  -  automatic completion

Slideout.js  -  mobile app sideslip navigation

Jquerymy  -  uses jQuery for bidirectional data binding

Cleave.js  -  real-time formatting input

Page  -  client single page application routing

Selectize.js  -Hybrid selection box used by   to add tag

Nice select  -  creates a jQuery library with beautiful selection boxes

Tether  -  uses fixed positioning to create related elements

Shepherd.js  -  creates a novice guide for the application

Tooltip  -  tooltip prompt box

Select2  -  Jquery selection box plug-in

Implementation of IziToast  -  notification pop-up window

Implementation of IziModal  -  modal box

CSS Library / Design related

Animate.css  -  Animation Library

Flat UI Colors  -  flat design color matching

Material design lite-   Google material design-based framework

Colorrrs  -  Random Color Generator

Section separators  -  CSS to realize region Segmentation

Topcoat  -  framework

Create ken burns effect  -  uses CSS3 animation to achieve Ken burns special effects

DynCSS  -  adds function to CSS and dynamically CSS

Magic animations  -  CSS3 for animation special effects

CSSpin  -  css spinners collection

Feather icons  -  Icon collection

Ion icons  -  Icon collection

Font awesome  -  Icon collection

Font generator  -  combines multiple fonts to create mixed fonts

On/Off switch  -  uses CSS to create on/off switches, radio buttons

UI Kit  -  framework

Bootstrap  -  framework

Foundation  -  framework

Useful products / links

Cheatsheet  -all tags that   can write in

Ghost  -  blog platform based on Node.js

What runs  -  a Chrome plug-in for website technical analysis

Learn anything  -  A powerful mind map for analyzing a topic

After reading the above, have you mastered any ways to save development time on front-end development resources? If you want to learn more skills or want to know more about it, you are welcome to follow the industry information channel, thank you for reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report