2020 nueva web front-end de base cero de rutas de aprendizaje (con video tutorial)

Miles de pequeña blanca de terminar un conjunto de interfaz web para el aprendizaje por supuesto, a través de este tutorial, se puede empezar de cero, paso a paso para dominar el desarrollo front-end de las habilidades pertinentes, y en última instancia el logro de la empresa los ingenieros de desarrollo de front-end primarias, de nivel medio de desarrollo front-end requisitos de trabajo ingeniero, ingeniero de desarrollo de alto nivel, el conjunto de los ingenieros de desarrollo de la pila.

diagrama de árbol de rutas de aprendizaje interfaz web

Esta ruta consiste en aprender los conocimientos front-end web incluye: HTML y CSS para empezar con la gramática básica, el desarrollo diario javascript, para lograr efectos especiales y todas las acciones de intercambio de datos común, nodejs, vue.js, reaccionar, Angular4 tales como el desarrollo de conocimientos, vue, applets, páginas del lado móvil, HTML + CSS y otras aplicaciones prácticas, y maestros Node.js, vue, JS y otros problemas comunes de la entrevista front-end web.

1. Básico (página reconstrucción frontal)

Blanco para web front-end para el aprendizaje, html + css fundación es particularmente importante, se puede decir que ser blanco programado única manera de aprender a escribir después de ver una página estática.

1) diseño del sitio terminal de PC

Incluye el conocimiento: base de HTML, CSS fundación, atributos principales CSS; apilamiento de estilo CSS, herencia, modelo de caja; contenedor, desborde y tipo de elemento, el navegador es compatible con el ancho y la altura de adaptación ......

2) HTML5 + CSS3 base de

Incluye conocimiento: nuevos elementos de HTML5 y atributos; campo de formulario elemento de mejora; selectores CSS3; estilo de fuente relacionada texto; desplazamiento CSS3 y procesamiento deformación ......

3) diseño de página de aplicación web

que comprende Conocimiento: mover la página final especificación de diseño; figura extremo movimiento tangencial; diseño de flujo (layout 100%); diseño de escala geométrica (layout REM); diseño sensible; página Taobao esquema de adaptación de terminal móvil ......

Aprendizaje Tutorial de vídeo:

Web conocidos front-end y el desarrollo profesional de
apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/18iC3TEGV50WDdoyZm7h9-Q 
cliente web de la entrada al maestro (HTML + CSS conjunto completo)
apoyar los materiales de aprendizaje: https://pan.baidu. com / s / 1Pd932pPEKYMNCW2n4pUOZw

2.  Programación JavaScript avanzada

Esta fase se centró en, y quieran aprender toda la parte delantera del ingeniero de desarrollo de pila, 0 Basics estudiantes. Tutorial colección de gráficos, vídeo, código, proyecto de todos los contenidos, permiten llevar a cabo el aprendizaje completo en tres dimensiones JavaScript.

Se le permite crecer desde el principiante al maestro completo dentro de 40 días. Después de estudiar el curso, es posible que tenga la capacidad de escribir como el mijo, Huawei y otros sitios web proveedor de electricidad del lado del PC.

1) el desarrollo de las características nativas JavaScript interactivo

Incluye el conocimiento: la gramática básica; bucle, y una gran variedad de funciones; cuerdas y fecha; BOM y DOM; eventos; efecto de arrastre; el almacenamiento de cookies, las expresiones regulares; Ajax; base orientada a objetos; los deportes y el desarrollo del juego ......

2) / ES6 / ES7 avanzada aplicaciones orientadas a objetos y ES5

El conocimiento que comprende: Promise; patrón de diseño (patrón de observador, etc.); cadena de prototipo; constructor, y contexto de ejecución se apilan un contexto de ejecución; objeto activo y el objeto variable; cadena de ámbito; cierre; esto; ES5; ES6; ES7 ......

3) herramientas biblioteca de JavaScript de investigación y desarrollo independiente

Incluye el conocimiento: biblioteca de DOM; biblioteca de eventos; bibliotecas AJAX; bibliotecas prototipo y la herencia; biblioteca central MVVM; SPA basado en la biblioteca de enrutamiento ......

Aprendizaje Tutorial de vídeo:

Versión 2020 JavaScript Tutorial básico Obras completas (muy recomendable)
que soportan el material de aprendizaje: https://pan.baidu.com/s/1vPYD82mB_AkBVB2q2Mk7qw
la copia a máquina conjunto completo de video (programadores es necesario)
el apoyo a los materiales de aprendizaje: https://pan.baidu.com / S / 1GXSD2HY2gmZfzhDxPUKCNA
2020DvaJS de vídeo de manera sucinta, toda la red a partir
apoyar los materiales de aprendizaje: https://pan.baidu.com/s/16-qABk4-qQqerqho9B_8RQ código de extracción: 6sv6

3. PC de gama de todo el desarrollo pila

Esta etapa se explica principalmente jQuery más comúnmente método utilizado, la estación entera tiene la capacidad de escribir extremos frontal completa y por el proyecto jQuery.

1) jQuery desarrollo efectos de interacción clásica

El conocimiento que comprende: efectos de línea de tiempo; Tab efecto página de conmutación; efectos de navegación de páginas; efecto de deslizamiento, se centran efecto de la rotación de la figura; menú de navegación efecto, efecto de cascada; el efecto emergente; efecto de cuenta atrás; efecto ...... lotería

2) PHP + MySQL infraestructura de backend

El conocimiento que comprende: Apache; PHP; MySQL; HTTP (s) protocolo detallado; Ajax avanzada, y multidominio defered; estructuras Apache y Nginx ambientales y configuración; definición de interfaz; datos Mock; el reparador; frente FBI y la parte trasera; seguridad front-end (XSS, CSRF, inyección JSON) ......

aplicaciones 3) de ingeniería front-end y modulares

Conocimiento incluye: Gulp; webpack; NGP; comandos de Linux; Git / SVN; CommonJS; AMD; CMD; ES6 modular ......

4) PC de gama de los proyectos de desarrollo conjunto de pila

Conocimiento incluye: una casa grande; página de la lista y la página de detalles; pantalla y efectos especiales interactivos; búsqueda; Entrar y registrarse; carro; jQueryUI con jQuery EasyUI; Bootstrap (ACE); Highcharts / eCharts; ArtTemplate; velocidad; Smarty; plataforma en la nube front-end; servidor Apache + PHP + MySQL configurado ......

Aprendizaje Tutorial de vídeo:

2020 jQuery versión Tutorial de inicio de la colección (visto más detallada)
apoyar los materiales de aprendizaje: https://pan.baidu.com/s/1R2n67Io55MgRKptsAO_7Lg

4. desarrollo backend Node.js

Principalmente en el desarrollo del lado del servidor nodejs etapa principal y marco común de servidor de compilación. Maestro de desarrollo del lado del servidor y el principio modular. Incluyendo servidores proxy, la autoridad de certificación, la comunicación oportuna, operación IO.

1) Base Node.js

Incluye el conocimiento: introducción Node.js, MongoDB; GraphGL; Express, Koa2; probando moka marco; programa de mensajería instantánea ...... zócalo

2) Node.js avanzada de proyectos full-stack

Incluye el conocimiento: basado en la estación M + + Node.js MongoDB-pila pleno desarrollo avanzado proyecto ......

Aprendizaje Tutorial de vídeo:

Los últimos nodejs de entrada al dios de
apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/13FCVc68ZnFdMhHkZtN1f7g código de extracción: hp2l
NodeJS + express elementos reales + MongoDB
apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/ 1YfcorhIR9etRJ_vxsvy0ig

marco front-end 5. Vue.js

Vue.js comprometido a construir el marco de desarrollo de aplicaciones web basadas en datos, es un MVVM racionalizado. Vue.js centran en modelo de capas MVVM modelo de vista. manipulación de datos sencilla, puede completar la página de actualización, por supuesto, hay muchos marcos similares, como angular, reaccionar, pero Vue con tecnología sencilla, ligera, módulos basada en datos, y otras ventajas encantaron los desarrolladores y empresas de front-end de amistad convirtió a los desarrolladores de aplicaciones para usuario de las habilidades necesarias.

1) Fundación de Desarrollo Vue.js

El conocimiento que comprende: infraestructura de desarrollo de aplicación web; el patrón MVVM; de la nariz montaje; de ​​un solo archivo de ensamblaje; valor de transferencia inter-componente; ejemplo Vue; E19Vue ciclo de vida ejemplo; Vue plantilla gramática; el cálculo de propiedades, métodos y el oyente; condiciones Vue en representación; lista Vue de la prestación; conjunto de métodos Vue; animaciones Vue ......

2) el desarrollo de aplicaciones aplicación web del proyecto Vue.js

Incluye el conocimiento: configuración del entorno; código de proyecto introdujo; un solo archivo de ensamblaje de enrutamiento Vue, una aplicación de una sola página frente a la utilización de varias páginas; Menta interfaz de usuario; Elemento de la interfaz de usuario; proyectos del FBI, probar y publicar en línea ......

Aprendizaje Tutorial de vídeo:

2020Vue un tutorial completo totalmente de código abierto (muy recomendable)

Apoyando a los materiales de aprendizaje: https://pan.baidu.com/s/1ykVWPDQjKhQgkibHZ3cdhQ código de extracción: 1zvr

Vue tutoriales para crear un marco orientado a objetos

Apoyando a los materiales de aprendizaje: https://pan.baidu.com/s/1tOTYYZU7dz6m2-8s0GbGaQ código de extracción: 4nc3

Vue de direcciones del teléfono móvil componente libro del video de combate

Apoyando a los materiales de aprendizaje: https://pan.baidu.com/s/1MVAaglD-0HEH487VjN6lJQ código de extracción: tckn

Tutorial del uso de la API de electrones, marco de alto nivel para reaccionar, vue de la integración, empaquetado y, finalmente, publicar sus propias aplicaciones de escritorio. Este curso es el combate basado en los proyectos, para ayudar a abrir Renduermai líder Vue.js, por lo que rápidamente se convierte en un buen desarrolladores Vue.js.

6. Reaccionar marco front-end

En esta etapa con el fin de desarrollo de combate como punto de partida, desde el principio para explicar el uso de Reaccionar, a partir de componentes básicos, el encaminamiento, el estado, las propiedades, la comunicación de datos entre los diversos problemas que se adaptan a la webpack, Redux y otros marcos convencionales y herramientas. Con una gran cantidad de casos prácticos y proyectos, a partir de la entrada para ayudar a que realmente va a utilizar React.

1) Reaccionar Fundación de Desarrollo

Incluye el conocimiento: Reaccionar Introducción; Reaccionar entorno de desarrollo listo; Reaccionar en el montaje; JSX gramática; la división entre los valores tradicionales y montaje de componentes; Reaccionar herramientas de desarrollo de instalar y utilizar; PropTypes y aplicaciones defaultProps; puntales, el estado y la función render relaciones, la comprensión Reaccionar DOM virtual; algoritmo de diferencias en DOM virtual; Reaccionar ref en uso; Reaccionar funciones del ciclo de vida y escenarios de uso; Charles realizar con el uso simulacro de datos local; reaccionan para lograr la animación CSS; Reaccionar-redux middleware utilizar ......

2) el desarrollo de aplicaciones de proyectos de aplicación web Reaccionar

Incluye el conocimiento: Hormiga Diseño biblioteca de componentes; Reaccionar Router 4 enrutamiento; preparación de los componentes del proyecto; Immutable.js utilizar para administrar datos en el almacén, el proyecto, la prueba del FBI y publicar en línea ......

Aprendizaje Tutorial de vídeo:

Reaccionar tutorial + Obras Completas de combate
apoyando los materiales de aprendizaje: https://pan.baidu.com/s/18j0EtU7pLlcd1jMlDDSNBg código de extracción: vvur
reaccionan lado del servidor representación -NextJS
que soportan el material de aprendizaje: https://pan.baidu.com/s/1AdANnTYIIrSngAWVgEq7pQ extracto código: x0hs
versión 2020 Reaccionar -React proyecto de gestión de vídeo de fondo https://pan.baidu.com/s/1BSK2eV9HWO8uzb2ATNQSZg extracción de código: vmqz

7. Desarrollo Híbrido (Hybrid, RN)

1) el desarrollo de número público de micro-canales

Incluye el conocimiento: número público conocimiento de micro-canales, las funciones básicas de los números de suscripción, el uso rápido código de Baidu BAE en línea, el uso de Git línea completa de implementación de código; número público permisos de desarrollo y acceso a la función; micro-canales API JSSDK interfaz; escenarios de micro-canal proyecto el desarrollo y el acceso a ......

2) el desarrollo de diversos tipos de aplicaciones híbridas

Incluye el conocimiento: independiente híbrido Navtive nativa (iOS, Android); tercero marco híbrido Cordova brecha / Teléfono; marco híbrido de terceros MUI + HTML5 ......

3) E Ali clavos aplicaciones empresariales (Alipay applet)

Incluye el conocimiento: desarrollo de la función E-aplicación de entrada, el proceso de desarrollo de aplicaciones E; Fundación de Desarrollo de Aplicaciones E; el combate de desarrollo de aplicaciones E ......

Aprendizaje Tutorial de vídeo:

Andrews desarrollo mixto de vídeo de manera sucinta y
el apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/132Cb0p_mMBalrc7Njdj1lw código de extracción: i0r6
tutorial de desarrollo de uso mixto de combate
apoyando los materiales de aprendizaje: https://pan.baidu.com/s/1OSyW32F7VosuW25CGlkuHA código de extracción : drx3

8. Pequeño programa de desarrollo

Esta fase se centró en las últimas características de applet de micro-canales, applet de explicar con todo detalle las características más recientes, applet de control completo desarrollado por este curso.

1) el desarrollo del programa pequeño de micro-canales

En el applet de micro-canales, la entrada applet aprender; experiencia de los componentes del applet, función de gran applet; combate proyecto en el que se necesita para conquistar el applet ......: Contiene conocimiento

2) el desarrollo de applets de múltiples terminales

Incluye conocimiento: applets Alipay; Baidu applet; applet de bytes ritmo ......

Aprendizaje Tutorial de vídeo:

Applet carta de combate proyecto de micro
apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/17IabhW0SWHnFhiZ3mDCduw
maullido todo programa de desarrollo pila de pequeño maullido de citas
apoyando los materiales de aprendizaje: https://pan.baidu.com/s/1ggShoLPpbryYc8oKbL1rCQ código de extracción : dlib

9. El desarrollo de APP nativa

Aleteo es el marco de interfaz de usuario móvil de Google, puede crear rápidamente interfaz de usuario nativa de alta calidad en iOS y Android.

En el desarrollo puede proporcionar milisegundos sobrecarga térmica, la interfaz de usuario expresivo, hermosa, cerca del rendimiento nativo. Pero también se pueden integrar fácilmente con el código nativo, es la elección del desarrollo de aplicaciones de terminal móvil.

1) Reaccionar nativo

Incluye el conocimiento: Preliminar Reaccionar nativo; Reaccionar proyecto de navegación nativo; Reaccionar cuadro de texto nativo proyecto; Reaccionar proyectos nativos a las páginas de desplazamiento; Reaccionar nativos Otros componentes ......

2) el desarrollo del alboroto

Incluye el conocimiento: Desarrollo listo; comienzo rápido; estructura interfacial; un elemento de base; diseño; vista; astilla; enrutamiento; formulario; botón; de entrada, caja, gestión del estado; solicitud de red; animación, pruebas, la liberación y el despliegue ......

Aprendizaje Tutorial de vídeo:

Aleteo conjunto completo del último vídeo - un conjunto completo de
materiales de aprendizaje de apoyo: https://pan.baidu.com/s/1Zvj164kzdUy3KrUvNU0s-A

marco frontal 10. angular

Conocimiento incluye: mecanografiado configuración del entorno básico y avanzado de desarrollo ;; ;; ;; Hello World arquitectura, módulos y componentes; plantilla; metadatos, enlace de datos y visualización de datos, la forma, los servicios y la instrucción; inyección de dependencias; enrutamiento; jónico 3 marco ......

Aprendizaje Tutorial de vídeo:

Angular4 desde la entrada hasta reales
materiales de aprendizaje de apoyo: https://pan.baidu.com/s/1gVwNyufWHewe3XHHpBzkRA

11. Ampliación de Visualización de Datos

Conocimiento incluye: base de visualización de datos; Echars, Hignchars; D3.js entrada; D3.js avanzada; D3.js selección y recopilación de datos; D3.js aplicaciones avanzadas; herramientas de aplicación D3.js: NVD3, n3-gráficos ......

Aprendizaje Tutorial de vídeo:

Los últimos immutable.js estructura de datos persistente
apoyo a los materiales de aprendizaje: https://pan.baidu.com/s/18c_tysaaXcshEN2ELYJPjA código de extracción: v4qq

 

preguntas de la entrevista

1) principalmente para recién contratado o estudiantes que acaban el trabajo dentro de los dos años:  la parte delantera de los nuevos participantes Preguntas frecuentes gran colección de
: apoyo a los materiales de aprendizaje https://pan.baidu.com/s/1Lx5-JMj6U_IqvCkWT9bRLw código de extracción: 699k
2 ) incluyen el diseño de página y la adaptación dispositivo, JS nativos, jquery.js, Vue.js, React.js, Node.js, la parte delantera y los extremos traseros de los problemas de colaboración e integración.  Las empresas se enfrentan preguntas de manera sucinta y ①-Node.js e ingeniería de proyectos
de apoyo material didáctico: https://pan.baidu.com/s/10XI6tutQhhWtp5nMjzXb3Q código de extracción: gupu
3) incluyen el diseño de página y la adaptación dispositivo, JS nativos, jQuery. js, Vue.js, React.js, Node.js, la parte delantera y los extremos traseros de los problemas de colaboración e integración. Las empresas se enfrentan preguntas de manera sucinta y ②-React.JS FAQ explique
a juego materiales de aprendizaje: https://pan.baidu.com/s/1iRPubj_Ck21Zp8LA7hYDOA código de extracción: c828

 

Más!

tutoriales web front-end en el acabado aquí, a finales de los tutoriales contenido actualizado, miles de pequeños serán los primeros en el tiempo para que todos puedan compartir, queremos aprender poco amigos ayuda!

Por último, damos la bienvenida a la atención de los críticos!

Publicados 348 artículos originales · ganado elogios 235 · vistas 700 000 +

Supongo que te gusta

Origin blog.csdn.net/GUDUzhongliang/article/details/104927465
Recomendado
Clasificación