¿Ruta de aprendizaje de front-end web?
¿A quién le importa la ola delantera o trasera?
¡Una ola que se puede agitar es una buena ola!
Sígueme y déjate perder un poco de cabello cada día. . .
Ruta de aprendizaje front-end:
Enlace web
¡La nueva hoja de ruta de aprendizaje front-end para 2020 se comparte con todos!
El aprendizaje es un proceso paso a paso y es muy raro persistir. Si realmente quieres aprender sobre desarrollo front-end, ¡debes tomar una decisión!
La hoja de ruta de aprendizaje front-end que comparto contigo aquí, espero que te sea útil. A continuación se muestra la versión actualizada para 2020.
@Shangxuetang Front-end Academy ha actualizado la hoja de ruta de aprendizaje de desarrollo front-end 2020, que incluye nuevas tecnologías y nuevos cursos en 2019.
También escribí sobre el tío de la tecnología, que es una tecnología que debe aprenderse para cada tecnología. Después de aprenderla, ¡serás un programador senior!
Marco de aprendizaje de front-end
En primer lugar, conceptos básicos de front-end web
La base de HTML+CSS es el punto de partida para el front-end intermedio. programadores y es imprescindible para ayudarle a aprender a programar.
Como todos sabemos, hay tres paneles básicos de front-end que conforman el mundo web. Son: HTML, CSS, JavaScript. Y cada parte requiere de mucha acumulación de conocimientos para poder utilizarla libremente.
HTML tiene mejores funciones semánticas, funciones de almacenamiento local, funciones de compatibilidad de dispositivos, funciones multimedia web, funciones CSS3, etc. Es una nueva generación de estándares de desarrollo web. Es solo que el soporte de h5 para terminales móviles ha mejorado enormemente. Actualmente, algunos navegadores de escritorio no son totalmente compatibles con HTML5 y es posible que algunas funciones nuevas no funcionen (la compatibilidad es bastante alta en los navegadores modernos). Los navegadores (o vistas web) en dispositivos móviles (Android, iOS) son en su mayoría núcleos de webkit y tienen un alto grado de soporte para HTML5. Generalmente, no habrá muchos problemas de compatibilidad cuando se utilicen en dispositivos móviles.
Javascript fue desarrollado por primera vez por Netscape. Fue nombrado para mantenerse al día con la popularidad de Java (en realidad no tiene nada que ver con Java). Luego, Microsoft ingresó al mercado de los navegadores, lo que llevó a la estandarización de JavaScript. El nombre estándar fue ECMAScript y JavaScript se convirtió oficialmente en un lenguaje. De hecho, JavaScript es un superconjunto de ECMAScript y puede considerarse lo mismo que el mecanografiado. Todos conocen el estándar ECMAScript. Los estándares y especificaciones de los que estamos hablando ahora se refieren a la especificación ECMAScript. Los estándares más populares son ES5 y ES6.
Vídeos de aprendizaje asistido:
Enlaces a páginas web
En segundo lugar, JavaScript
JavaScript es el lenguaje de programación de Internet.
Todas las páginas HTML modernas utilizan JavaScript.
JavaScript es muy fácil de aprender.
Contenido principal de aprendizaje: conceptos básicos de JavaScript, funciones de JavaScript, matrices y objetos de JavaScript, DOM, ejemplos prácticos,
análisis Json, orientado a objetos, prototipo y cadena de prototipos y orientación.
Enlaces de descarga de vídeos compatibles:
Enlaces a páginas web
En tercer lugar, jQuery
JQuery es una biblioteca de JavaScript.
JQuery simplifica enormemente la programación en JavaScript.
Los principales propósitos internos del aprendizaje son: conocimientos básicos de jQuery, métodos comunes de jQuery, operaciones de nodos de jQuery y contacto práctico de jQuery.
Enlaces de descarga de vídeos de soporte:
Enlaces a páginas web
Cuarto, Ajax
Ajax = JavaScript y XML sincrónicos (JavaScript y XML asincrónicos). XML).
ALAX no es un nuevo lenguaje de programación, sino una nueva forma de utilizar los estándares existentes.
La mayor ventaja de AJAX es que puede intercambiar datos con el servidor y actualizar parte de la página web sin recargar toda la página.
Rong.
AJAX no requiere ningún complemento del navegador, pero requiere que el usuario permita que JavaScript se ejecute en el navegador.
Aplicación AJAX
Usa XHTML+CSS para expresar información;
Usa JavaScript para operar DOM (Document Object Model) para efectos dinámicos;
Utilice XML y XSLT para manipular datos;
Utilice XMLHttpRequest o la nueva Fetch API para intercambiar datos asincrónicos con el servidor web;
Nota: AJAX es diferente de las tecnologías RIA como Flash , Silverlight y Java Apple.
Enlace de descarga coincidente:
Enlace a página web
Verbo (abreviatura de verbo) Nuevas funciones de H5
HTMT es para que usted pueda navegar El idioma de los comandos dados al servidor. Por ejemplo, desea mostrar un artículo en el navegador que tenga imágenes y texto. Tienes que decirle cuál es el texto, cuáles son las imágenes, dónde colocarlas y qué estilo (color, tamaño, alineación...) se requiere. Llamamos página web a la página que muestra el navegador.
Contenido principal: Frameworks comunes, terminales móviles y REM, elementos canvas y nuevas funcionalidades de H5.
Enlace de descarga de vídeo de soporte:
Enlace a página web
Verbo intransitivo Angularjis
¿Qué es AngularJS? Marco de JavaScript. Se puede acceder a él a través de
AngularJS extiende HTML con directivas y vincula datos a HTML con expresiones.
Contenido principal: Comandos de Angle, Enrutamiento de Angle, Servicios de Angle, Servidores de personalización de Angle e Instrucciones de personalización de Angle.
Enlaces de descarga de vídeos de soporte:
Enlaces a páginas web
Seven. Modularidad
Actualmente existen dos métodos de lenguaje principales para implementar la ontología modular: uno es la extensión del lenguaje lógico basado en semántica no clásica, como la lógica de descripción distribuida, el enlace electrónico y la lógica de descripción basada en paquetes. se basa en la semántica lógica de descripción clásica, pero restringe el uso de símbolos externos para garantizar que los módulos se puedan fusionar de forma segura.
Contenido principal: conceptos básicos del módulo, requisitos y requisitos prácticos.
Enlaces de descarga de vídeos de soporte: enlaces web
8. Herramientas de construcción front-end
¿Qué son las herramientas de construcción front-end?
Por ejemplo, realizamos algunas operaciones como CoffeeScript/ES6 en lugar de compresión Javascript, JS o CSS, usamos Less para escribir CSS, usamos Jade para escribir HTML, usamos Browserify para modularizar y agregamos el sello MD5 a Recursos de implementación no cubiertos. Estos requieren mucho tiempo y energía. Por lo tanto, las herramientas de construcción frontales, o herramientas de construcción automatizadas frontales, se utilizan para evitar que hagamos repeticiones mecánicas y liberar nuestras manos.
Contenido principal: webpack y gulp.
Enlaces de descarga de vídeos de soporte:
Enlaces a páginas web
Nueve, reacciones
React es una biblioteca de JavaScript lanzada por Facebook para Build the interfaz de usuario. React se utiliza principalmente para crear una interfaz de usuario. Mucha gente piensa que React es la V (vista) en MVC. React tiene un alto rendimiento y una lógica de código simple. Cada vez más personas le prestan atención y lo utilizan.
Contenido principal: base reactiva, construcción de entorno reactivo, enrutamiento reactivo 3.x, enrutamiento reactivo 4.x, marco de interfaz de usuario reactivo antd, adquisición de solicitudes de red reactiva.
Enlaces de descarga de videos compatibles:
Enlaces a páginas web
X. Un determinado software de edición de videos
Vue se refiere al marco de vue. .js Vue.js es un popular marco de interfaz de usuario de JavaScript, un marco de JavaScript de código abierto para crear interfaces de usuario diseñadas para organizar y simplificar mejor el desarrollo web.
Enlace de descarga de vídeo de soporte:
Contenido principal: conceptos básicos del módulo, requisitos y requisitos prácticos.
Enlace de descarga de vídeo de soporte:
Enlace a página web
XI.
Mini programa
Admite enlaces de descarga de vídeos:
Enlaces a páginas web
Notas sobre el aprendizaje del front-end web 1. No te concentres en leer. Aprender programación no es tan fácil como las matemáticas y el chino. Basta con mirar los ejemplos. Lo que más se necesita es la explicación de otra persona. Sólo confías en tu propia conciencia para leer el vocabulario profesional de tu propio libro, pero en circunstancias normales no podemos entenderlo. Después de todo, no somos un editor. La mejor manera es aprender de los videos, encontrar buenos videos de los cuales aprender y luego combinarlos con los videos de otras personas.
2. Lo mejor es estudiar de forma sistemática y profesional, porque si eres un principiante con poca o ninguna base, el autoestudio puede ayudarte a empezar, pero definitivamente darás muchos rodeos o te llevará más tiempo. otros, por lo que es mejor estudiar de forma sistemática, lo que no solo te ayuda a empezar rápidamente, sino que también tiene grandes oportunidades de mejora y puedes producir resultados en un corto período de tiempo.
3. Cuando estudias, es posible que no puedas olvidarlo una vez que termines de estudiar. Por ejemplo, cuando estábamos aprendiendo inglés, aprendíamos 20 palabras al día, pero después de una semana, definitivamente olvidaría las palabras que había aprendido antes. Entonces, la mejor manera de recordar estas palabras es usarlas en una conversación. Con respecto al front-end web, aprendimos las mismas cosas, las mismas etiquetas o atributos, o la sintaxis de JavaScript. Sólo si continúas viéndolo y aplicándolo podrás hacer que todos te conozcan, para que puedas tener una comprensión sólida, por lo que la aplicación práctica es muy importante.
4. El método de aprendizaje determina la eficiencia del aprendizaje del front-end web y hasta dónde se puede llegar. Aprender a programar depende en gran medida de un buen método de aprendizaje. Demasiadas personas terminan por darse por vencidas debido a métodos de aprendizaje incorrectos, por eso les pido que presten atención a sus propios métodos de aprendizaje. Los métodos de aprendizaje de cada persona son diferentes, pero los métodos de aprendizaje incorrectos de la mayoría de las personas son los mismos, por lo que debes pedir consejo a profesionales al respecto.