Web development is divided into front and back. As a backend engineer or front-end engineer, front-end development may be a headache.
Along the way, candelease was able to record the experience of modern front-end development.
Front-end development in the Dark Age
In this era, the frontend development process may be like this: the latest masterpiece of the UI front-end framework! Trial with prize!
. Code
- * Write various HTML, CSS, and JS
- * Go to the website of various front-end modules to manually download various libraries
- * Refresh the browser over and over again to view the effect
- * Final compression of various static files
Problem. Code
- * The HTML code is repeated. For example, for a header and footer, it is very likely to violate dry,
- It will definitely be analgesia during later maintenance.
- * You cannot view the results in real time. You need to refresh them manually. For example, if you are a Java Server with some pain points, writing an API cannot be automatically loaded.
- Manual restart is required. Several bugs cannot be called in one hour (Life is too short, please use Python ).
- * Many people will not compress this task.
- * The code is very inefficient. jquery is indeed flexible, but after a long time, the code will overgrow, especially when there are
- When someone else takes over your code, it is very likely that you don't understand it, and then refactor it. That's why the front-end displays various
- Reasons for the MVC Framework
The latest UI front-end framework! Trial with prize! Modern front-end development
This age is no longer an age of farming.
First, let's talk about MVC.
MVC has been in the backend for more than N years, and the front-end has also appeared, but does the front-end use MVC
Things are open to discussion. My personal experience is that if your project is small, only you 1 ~ 2 Engineers
The MVC framework is not required for maintenance. The reason is simple: learning cost, time is precious, and learning cost.
It is definitely a hard injury. For example, when you choose backbone angular, steep learning curves will not only affect
You will experience this pain when new people use your project on their own.
The advantages of MVC seem to be worth mentioning.
My practices
There are many excellent open-source projects on GitHub, and there are also many front-end tools. Make good use of the tools and make good use of the excellent libraries.
A scaffolding project UI front-end framework of my brunch is the latest masterpiece! Trial with prize!
. Code
- Check to use different branches, or directly download release
- * If you use coffee to write JavaScript code, coffee will help you avoid various pitfalls in JavaScript code and use Python-like syntax.
- * The HTML and CSS template engines allow you to write fewer letters
- I chose jade for HTML. You can use the include syntax to reduce the possibility of dry.
- Css I select stylus
- * Using build tools, I use brunch, NPM, Bower
- Brunch solves the problem of manual refresh and Automatic Engine coffee, Jade, and compilation in the dark age.
- Bower makes the installation method of JS and CSS libraries very simple.
- NPM is similar to Bower
- * For Bootstrap or purecss (Yui), you may prefer to use purecss (IE7 +). For IE6, You need to manually write CSS.
- * If you do not need MVC and are not familiar with JS, you can use zarkfx, which will definitely save your development time,
- For details about how to use brunch + jade for zarkfx, refer to the Br-coffee-jade branch of my simple project.
- * If you use MVC, select backbone + Chaplin or angular. Pay attention to the limitations in MVC,
- For example, after using MVC, they have their own driver mechanism, which imposes restrictions on Dom operations, especially when they cannot be used.
- This is annoying because of zarkfx.
Remember, there will always be ways to solve repeated operations, improve your development efficiency, and use tools for modern web development.
Modern front-end development Note
