1.Web front and full stack definition:
A, what is the traditional front-end traditional web: designers need to design draft, cut finished drawing, writing labels and styles, JS achieve results, in short that is, only need to know the structure of HTML pages, CSS, page style, javaScript behavior of the page (including the effectiveness and integration of the page);
B, a large front-end HTML5 era: to deal with a variety of end-compliant development (PC, mobile terminal, various browsers), mobile APP development and mobile site development, Ajax + server technology development, asynchronous interaction and development background, advanced design patterns and frameworks (MVC, AngularJS ...), the use of automated workflow (Grunt), site security, SEO, testing, source code management, teamwork, making HTML5 games .
C, full-stack era: one set of front and back ends of Daniel, will be front-end language and language background, front and back take-all, be able to find the problem and the ability to solve problems quickly.
D, NodeJS: JS is used as the basis of a background language, so that the front end of all-powerful, now the front-end has been a breakthrough all boundaries.
2.web front-end development environment with:
A, Sublime3 installation configurations: front-end development artifact Sublime cross-platform, is a shareware, free of charge; Sublime3 download the latest installation package;
- official website address: http://www.sublimetext.com/
- network disk address: http://pan.baidu.com/s/1ntszCgT
- Install Package Manager
Open Sublime3 console, ctrl + ~
Enter the installation package manager command code, attention to the need to install networking, because online download package
Official website address Package Manager: https://packagecontrol.io
- install third-party plug-ins (package)
Open command panel: ctrl + shift + p;
Enter the install, then Enter, then you can search for the desired plug-in, enter the installation; Atom tools
B, Atom tools: published by github front-end development tools, integrated chrome debugging tool, is a very powerful development tools and development platform. It is set in the setting file inside inside, including font size, shortcuts, background color themes;
Official website address: https://atom.io/
Baidu network disk Download: http://pan.baidu.com/s/1ntszCgT
C, WebStorm10 installation and use: WebStrom is the most professional IDE front-end development tool, is a very heavyweight development tools, a professional for our front-end design of the IDE, use it to develop the efficiency is very high;
D, summarize the pros and cons of three tools: Sublime3: you need to install third-party packages, in general. Atom: integration is very good, very light, you need to install their own third-party packages. Webstrom: large projects, it is recommended to use webstrom, very powerful, but also very heavy
3. The operating system commonly used shortcuts
- Shortcuts let you become a senior, the way professional front-end engineers must pass through, is that we must be mastered.
- Win + number keys: Open / display program Super taskbar icon representing the N-th
- Win + D: Fast Show Desktop
- Win + R: Run fast, open software, cmd command line, etc.
- Win + E: quickly open Explorer
- Win + arrow keys: maximize reduction / minimize window
- Win + L: Lock the computer quickly
- Ctrl + Alt + Del: the following options: lock the computer, switch users, log off, change your password, and start the task manager
- CTRL + SHIFT + ESC: Open the Task Manager
- Alt + F4: Closes the active project or exit the active program
- Alt + Tab: switch open project
- Alt + Up Arrow: View current folder on a directory in Windows Explorer
- Ctrl + A: In the document window, or Select All Ctrl + C: Copy the selected item
- Ctrl + Down Arrow: Move the cursor to the next segment in the first paragraph of
- Ctrl + Esc: Open the Start menu
- Ctrl + F4: Close the active document (in the program allows you to open multiple documents)
- Ctrl + Up Arrow: Move the cursor to the beginning of the previous paragraph
- Ctrl + V: Paste the selected item
- Ctrl + X: Cut the selected item
- Ctrl + Y: a restore operation
- Ctrl + Z: undo operation
- DELETE: delete the selected item and move it to the Recycle Bin
- ESC: Cancel the current task
- F2: Rename selected item
- F4: display the Address bar list in Windows Explorer
- F5: Refresh the active window