Basic configuration of modern front-end development environment

Introduction: In this article, the author will share with you a basic environment configuration for front-end development. If you want to develop/test some functions quickly, then the configuration in this article will be very useful to you. It also lays a good foundation for easy expansion after completing the initial test.

image


Today Angular and React are the standard configuration for front-end development. In order to avoid too much complexity for beginners, this article provides a quick step for front-end developers to choose.


The installation steps are as follows:


1 Create a git-repo for the project, add a readme file and a .gitignore file.

2 Initialize npm: npm init

3 安装lite-server:npm install -save-dev lite-server

4 Add the lite-server configuration file bs-config.json: update npm-start script: lite-server

5 Install and initialize some dependencies:


npm install --save bootstrapnpm install --save jquerynpm install --save font-awesome


6 Create home page index.html

See the sample code below.


After completing the above steps, you can proceed to test development. The entire environment achieves rapid reuse in the lightest form.


index.html screenshot


The code of this page is available in the repository, you can see the following code part structure.


image


image

Basic environment configuration for front-end development


Other screenshots


Here are some other related screenshots, showing the folder structure and some code. Likewise, if you clone the repository, you can use all of them. 


image

I wish you all a happy coding~


Guess you like

Origin blog.51cto.com/15127566/2664700