Web Examples
Lucid & Futuristic Production Boilerplates For Frontend(Web) Apps, React/RN/Vue, with TypeScript(Optional), Webpack 4/Parcel, MobX/Redux :dizzy: 多技术栈前端项目模板
Overview
fe-boilerplate is a collection of React/Vue.js templates and practices based on the author's daily work. The templates are designed to support the latest development processes and optimize the production environment. The project includes templates for different levels of developers, from beginners to advanced, as well as templates for various levels of complexity, including production environments and micro-frontends.
Features
- Technology Stack Support: ES6/ES7 syntax, CSS Modules, SCSS, Less (with CSS Modules), PostCSS for automatic Polyfill, styled-component for CSS-in-JS styling, TypeScript as a static language, Jest as the default testing framework.
- Development Environment: WebpackDevServer for deploying development server, component hot reloading, TS/Babel for code conversion, ESLint for code linting, DllPlugin for extracting common code in the development environment to optimize compilation speed.
- Production Environment: CommonChunksPlugin (provided by Webpack 4) for extracting common code in the production environment, Prepack & prepack-webpack-plugin for code optimization, offline-plugin for enhancing PWA features.
- Deployment Options: Support for independent deployment (HashRouter), server-side deployment, server-side rendering.
Summary
fe-boilerplate is a collection of React/Vue.js templates and best practices for web development. It provides a comprehensive set of features to support different levels of developers and project complexity. The project includes support for various technologies, such as ES6/ES7, CSS Modules, TypeScript, and Jest. It also offers development and production environment optimizations to enhance productivity and performance.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- Mobx
MobX is a simple and scalable state management library for JavaScript applications. It uses reactive programming techniques to automatically update the user interface in response to changes in the application state, making it easy to build complex and dynamic user interfaces with minimal code.
- Redux
Redux is a state management library for JavaScript apps that provides a predictable and centralized way to manage application state. It enables developers to write actions and reducers that update the state in response to user interactions, server responses, and other events, and can be used with a variety of front-end frameworks and back-end technologies.
- Webpack
Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.