web front end - doubility-sky/daydayup GitHub Wiki
Front-end web development is the development of the graphical user interface of a website, through the use of HTML, CSS, and JavaScript, so that users can view and interact with that website.
Learn
- Frontend Roadmap
- front-end-guide Study guide and introduction to the modern front end stack.
- 前端九部 - 入门者手册2019
- 前端开发漫游指南
Browser
- Inside look at modern web browser part1, part2, part3, part4
- Google Chrome is made possible by the Chromium open source project and other open source software.
- chrome comic book
- Vimium is a Chrome extension that provides keyboard-based navigation and control of the web in the spirit of the Vim editor.
- BrowserGap - Browser you can embed in your app. Per-seat or per-site licensing. Discounts for governments and non-profits.
- 深入浅出浏览器渲染原理
Practice
- The perfect Front-End Checklist for modern websites and meticulous developers https://frontendchecklist.io
- Front-end Job Interview Questions: A list of helpful front-end related questions you can use to interview potential candidates, test yourself or completely ignore. https://h5bp.org/Front-end-Developer-Interview-Questions/
- 构建单页Web应用
- 卖菜的前端, 杭州宋小菜网络科技前端技术文集
Libraries
DOM
- jQuery JavaScript Library https://jquery.com/
- Prototype is a JavaScript framework that aims to ease development of dynamic web applications. It offers a familiar class-style OO framework, extensive Ajax support, higher-order programming constructs, and easy DOM manipulation.
Utility
- Lodash - A modern JavaScript utility library delivering modularity, performance, & extras.
UI
- Radix UI - Components, icons, colors, and templates for building high-quality, accessible UI. Free and open-source.
Animation
- Motion is the only animation library with first-class APIs for both JavaScript and React.
Others
- Modernizr is a JavaScript library that detects HTML5 and CSS3 features in the user’s browser. https://modernizr.com
Frameworks
- react, vue, angular
- Svelte is a new way to build web applications. It's a compiler that takes your declarative components and converts them into efficient JavaScript that surgically updates the DOM.
- Lit is a simple library for building fast, lightweight web components.
- htmx allows you to access AJAX, CSS Transitions, WebSockets and Server Sent Events directly in HTML, using attributes, so you can build modern user interfaces with the simplicity and power of hypertext
Visualization
- D3: Data-Driven Documents (or D3.js) is a JavaScript library for visualizing data using web standards.
- ECharts: A Declarative Framework for Rapid Construction of Web-based Visualization
Tools
- Chrome Dev Tools 使用指南
- Responsively App: A modified web browser that helps in responsive web development. A web developer's must have dev-tool.
FAQs
Resources
- https://github.com/sindresorhus/awesome#front-end-development
- Font-Awesome The iconic SVG, font, and CSS toolkit https://fontawesome.com
- Awesome The Front End Develop Guide：这份指南汇集了前端开发所使用语言的主流学习资源，并以开发者的视角进行整理编排而成。