This is a little book about front-end engineering (about 4W words). Project Address:

Github.com/woai3c/intr…

Front-end engineering is actually the application of software engineering in the front end. What is software Engineering? Take a look at baidu Baike’s definition:

Software engineering is a discipline that studies the construction and maintenance of effective, practical and high quality software by engineering methods

In other words, the purpose of engineering is to improve the team’s development efficiency. For example, we are familiar with the knowledge of build packaging, performance optimization, automatic deployment, etc., all belong to engineering content.

The reason why I write this little book is to make a summary of the practical experience and learning experience of engineering in the past two years. Hope to make a comprehensive and systematic summary of front-end engineering knowledge.

Most of the short book is explained in the form of theoretical knowledge + code examples + pictures, in an effort to make it easier for readers to understand. In addition, there are a small number of chapters in the theoretical knowledge, there are corresponding practical tutorials. For example, in the section of front-end monitoring, after explaining the principle of front-end monitoring, it will teach you how to use existing monitoring tools to monitor projects.

Some people may ask, when do you start engineering? I think engineering can be done in the requirements review stage, selecting the appropriate technology stack according to the requirements (technology selection), and then formulating relevant specifications…

Online access

  • Access Entry 1
  • Access Entry 2

directory

  1. Technology selection: How to do the technology selection?
  2. Uniform specifications: How do you create specifications and use tools to ensure that they are strictly followed?
  3. Front-end componentization: What is modularization and componentization?
  4. Testing: How do I write unit tests and E2E (end-to-end) tests?
  5. Build tools: What are the build tools? What are the features and advantages?
  6. Automated Deployment: How to automate deployment projects with Jenkins, Github Actions?
  7. Front-end monitoring: explain the principle of front-end monitoring and how to use Sentry to monitor the project.
  8. Performance Optimization (I) : How to detect website performance? What are some useful performance tuning rules?
  9. Performance Optimization (2) : How to detect website performance? What are some useful performance tuning rules?
  10. Refactoring: Why do refactoring? What are the techniques for refactoring?
  11. Microservices: What are microservices? How to set up a microservice project?
  12. Severless: What is Severless? How to use Severless?
  13. The resources

Microservices and Severless are not engineering content, but from the perspective of improving development efficiency, they can also be summarized into this scope.

The order of contents is assigned according to the life cycle of a project:

  1. After receiving the new demand, make the technical selection according to the specific situation after the demand review.
  2. A unified specification is required before development.
  3. Learn modularization, componentization, for writing code is very good.
  4. Once developed, the code needs to be tested.
  5. Build packaging.
  6. Deployment takes effect.
  7. Monitor the project to find out any problems.
  8. Decide whether to optimize performance based on project performance.
  9. Projects become more complex and need to be refactored to improve maintainability.
  10. As the project grows larger, consider whether to break it up with microservices (or manage the project using Git subModules and Monorepo).
  11. Instead of managing your own server or database, consider Serverless.

Pay attention to

This book is designed to be an introductory tutorial, providing a comprehensive introduction to the engineering knowledge available at the front end. Suitable for front-end engineering do not understand or understand not much “rookie” students. If you’re an old bird, that book might not be for you.

In addition, it is suggested that readers should be able to practice in accordance with the practical part of the book when reading this book. If the reader can strictly follow the instructions to practice, after reading this book, he will not only gain the theoretical knowledge of front-end engineering, but also gain the corresponding practical experience.

What will you learn?

  • Have a thorough and clear understanding of front-end engineering
  • Lay a solid foundation for the path of architect

Appropriate crowd

  • Want to learn about the engineering front end
  • Basic knowledge of HTML, CSS, JavaScript

License

MIT