¿Qué conocimientos necesitas aprender para el desarrollo web front-end?

Recientemente, muchos amigos han dejado mensajes preguntando qué conocimientos necesitan saber para aprender front-end desde cero. ¿Es fácil para los principiantes aprender a desarrollar front-end web? En respuesta a sus preguntas a continuación, Shangxuetang Front-End Academy se lo presentará.

En primer lugar, déjame presentarte qué hace exactamente un ingeniero front-end.

Su trabajo principal es convertir el diseño de la interfaz de usuario en una página HTML de acuerdo con los estándares w3c y utilizar el lenguaje de secuencias de comandos JavaScript para implementar la interacción frontal en la página. Los efectos interactivos incluyen capas emergentes, cambio de pestañas, desplazamiento de imágenes e interacción asincrónica ajax.

Los ingenieros senior de front-end también son responsables del trabajo de optimización de front-end y tendrán más conocimientos de optimización, como caducidad de archivos, almacenamiento en caché, almacenamiento en caché asíncrono, js, css y compresión de imágenes, etc.

El desarrollo front-end es un trabajo muy especial. El trabajo de un ingeniero front-end parece fácil, pero definitivamente no lo es tanto. El proceso de desarrollo cubre una amplia gama de cosas. Es necesario pensar en la implementación de la página desde un punto de vista técnico y evitar puntos ciegos técnicos. También es necesario pensar desde el punto de vista del usuario, cómo aceptarla mejor. los datos aburridos presentados por la tecnología, y más Presentar bien la información. En pocas palabras, su función principal es integrar mejor los datos del sitio web y la aceptación del usuario, y presentarles una interfaz de datos amigable.

El ingeniero de front-end es una profesión muy nueva que realmente ha comenzado a recibir atención a nivel nacional e incluso internacional desde hace no más de 5 años. Internet se está desarrollando a un ritmo rápido, desde las páginas web WEB1.0 a WEB2.0, luego al nuevo HTML5, CSS3, y ahora con el auge de nuevas tecnologías como los teléfonos móviles y las redes 3G, las páginas web también han sido dominadas. basado en gráficos y texto, y ahora tiene varias diversas aplicaciones, interacciones y presentaciones multimedia enriquecidas basadas en tecnología front-end, más información, contenido más rico y una experiencia más amigable se han convertido en requisitos para el desarrollo front-end de sitios web. Los sitios web han experimentado cambios trascendentales. El desarrollo de sitios web requiere cada vez más ingenieros de front-end, pero actualmente la demanda de ingenieros de front-end es mayor que la oferta y los talentos de front-end son muy escasos. Por lo tanto, los ingenieros de desarrollo front-end de alta calidad serán una profesión muy popular en los próximos cinco años y las perspectivas de desarrollo son muy prometedoras.

Entonces, ¿qué conocimientos deben tener los principiantes sin conocimientos básicos sobre el front-end web?

Si eres un novato que acaba de empezar, lo primero que debes dominar son los conocimientos básicos de desarrollo front-end y lenguajes de programación relacionados HTML, CSS, JavaScript, al diseñar la página; HTML define elementos, CSS posiciona los elementos mostrados y JavaScript se utiliza para lograr los efectos e interacciones correspondientes. Todos estos conocimientos son básicos y deben dominarse de manera competente para poder escribir con fluidez.

Aprender un lenguaje de programación es, por supuesto, complementario a las herramientas. Mientras se aprende un lenguaje, es necesario dominar el uso de las herramientas de desarrollo. Para los principiantes, existen varias herramientas comunes que se utilizan al principio:

1. Dreamweaver: un editor de código web WYSIWYG que integra la producción de páginas web y la gestión de sitios web.

2. Sublime, nombre completo Sublime Text, es un editor de código cuyas funciones principales incluyen revisión ortográfica, marcadores, API Python completa, función Goto, cambio instantáneo de proyectos, selecciones múltiples y ventanas múltiples

3. HBuilder: es un IDE de desarrollo web lanzado por DCloud que admite HTML5.

Después de familiarizarse con estas herramientas, debe tener una cierta comprensión del trabajo de desarrollo básico. En este momento, si desea mejorar sus habilidades, puede aprender a usar más herramientas, como Bootstrap. que puede brindarle desarrollo web. Proporciona diseños, formularios, botones, tablas, sistemas de red, etc. más modernos. Secureheaders puede implementar automáticamente reglas de encabezado relacionadas con la seguridad para evitar XSS, HSTS y otros ataques.

El camino hacia el desarrollo front-end no es estático y puede cambiar según el desarrollo de los tiempos, las actualizaciones de software y las condiciones. el contenido de aprendizaje, sin embargo, establezca una buena base, no importa qué aspecto del conocimiento aprenda, será útil.

¡Después de una breve comprensión, es hora del evento principal!

¿Cómo aprenden los novatos en front-end web?

Malentendidos de aprendizaje entre autodidactas de front-end:

Lo que aprenden puede estar desactualizado

Lo que se considera un clásico está desactualizado o ya existe uno mejor lo sustituye, y sus canales para obtener información son limitados y las noticias se quedan atrás, lo que resulta en un contenido de aprendizaje relativamente retrasado.

2. Métodos de aprendizaje a ciegas

Si no entiendes un libro, buscarás tutoriales en vídeo para aprender si sientes que los tutoriales no se ajustan a tus gustos. , encontrará otros métodos porque carece de capacidad para identificar recursos, siempre estudia a ciegas sin una planificación clara de la ruta de aprendizaje, lo que resulta en un aprendizaje ineficaz durante demasiado tiempo y con pocos beneficios.

3. Sólo teoría, falta de formación en proyectos reales.

La comprensión de la tecnología se mantiene en el nivel teórico, pero falta experiencia en proyectos empresariales reales si no hay prácticas o trabajos relevantes. experiencia, no hay necesidad de capacitación inicial. La división específica de responsabilidades y los procesos de trabajo de los puestos no se comprenden completamente.

Cómo estudiar por su cuenta el conocimiento front-end:

Método de autoestudio:

Como principiante, debe tener un plan de aprendizaje sistemático claro. Te recomiendo que tengas un mentor, tienes que aprenderlo todo por tu cuenta y la posibilidad de rendirte es muy alta. Cuando no tienes idea sobre el front-end web, necesitas que alguien te guíe. Y luego tienes que estudiar por tu cuenta. El primer paso es determinar qué contenido se necesita para el front-end web y ¿cuánto tiempo lleva completar el curso? El tiempo recomendado es de 6 meses.

2. Los vídeos son la parte principal, complementados con libros. A muchos principiantes les gusta comprar libros cuando aprenden front-end, pero ¿cuál es el resultado final? Parece que no puedo escribir nada después de leerlo, así que me gustaría recordarles que pueden leer el libro, pero es más beneficioso establecer e implementar la operación específica de un determinado punto de conocimiento antes de usar el libro para consolidar. el concepto. Tu comprensión del conocimiento.

3. Para el aprendizaje de tecnología, es muy importante dominar un método de aprendizaje. De hecho, para las interfaces web, muchos métodos de aprendizaje son iguales. "Si el método es incorrecto, los esfuerzos serán en vano." De hecho, hay muchas cosas sobre esto. Les daré un ejemplo simple. Algunas personas escriben código mientras escuchan la conferencia. Esto está mal. Cuando escuchan la conferencia, concéntrese en escuchar y cuando hace las preguntas. haciendo las preguntas Esto es lo que la gente ha experimentado, debes escuchar. Dependiendo de las diferencias de cada uno, el método de aprendizaje también puede tener una salida. Encontrar un método de aprendizaje que se adapte a sus necesidades es el requisito previo para aprender.

4. No se recomienda aprender a ciegas por uno mismo. Según las personas que conozco, no hay muchas personas que comiencen desde cero y finalmente logren hacer este trabajo. Parte de la razón es que no entienden qué hace la interfaz web o qué aprender, por lo que compran libros a ciegas para leer, buscan videos en todas partes para verlos y finalmente se dan por vencidos después de verlos. que los principiantes aún lo lean antes de tener un concepto específico. Después de charlar, sabrá qué hace el front-end web y cómo aprenderlo. Esta es mi sugerencia personal. adoptarlo.

Libros y materiales de front-end de lectura obligada:

1. "El arte de la programación DOM de JavaScript"

Súper bestseller de front-end, imprescindible. Lea para programadores de front-end más de dos veces. Este libro es especialmente adecuado para los recién llegados que son nuevos en el front-end. La tecnología central del front-end es JavaScript, que también es la dificultad del front-end. Este libro es muy adecuado para comenzar, es fácil de entender y los casos vívidos pueden ayudar a los principiantes a comprender mejor. Muchas de las ideas de programación mencionadas son adecuadas para que las aprendan desarrolladores front-end de nivel bajo a intermedio.

2. "La guía definitiva de JavaScript"

También es un libro de lectura obligada para programadores front-end. No solo es adecuado para principiantes, sino también para programadores que. Ya estamos trabajando en el front-end. Léelo en cualquier momento. Cubre todo lo relacionado con JavaScript, así como la API de JavaScript implementada por los navegadores web. Es muy útil comprender los conocimientos básicos de js, como objetos, matrices, sintaxis, alcance, cierres, etc.

3. "Programación avanzada de JavaScript"

Si desea aprender JavaScript de manera muy completa y sistemática, le recomiendo este libro. Puede conservarlo y usarlo todo el tiempo. También puede extraer puntos clave durante el proceso de este libro, que pueden usarse como referencia en el futuro. Es una ayuda muy poderosa en el trabajo. También se puede utilizar muy bien durante las entrevistas, lo que comúnmente llamamos el "Pequeño Libro Rojo".

4. "JavaScript que no conoces"

Este libro no es adecuado para principiantes en front-end. Si deseas tener un conocimiento profundo de los principios de JavaScript, es recomendable. Es un libro imprescindible para todo programador front-end. Es necesario que los desarrolladores de JavaScript que no están familiarizados con JavaScript enfrenten las dificultades, profundicen en el lenguaje y descubran el propósito de cada componente de JavaScript. Si puede comprender completamente este libro, podrá comprender y dominar rápidamente todo lo que comprenda en el futuro.

5. "Guía autorizada de Vue.js"

Vue, como marco de interfaz de usuario principal, es el más utilizado en China, por lo que para comprender los principios de Vue, debe Debes leer un libro de Vue. La razón por la que recomiendo este libro es porque tiene una mejora cualitativa al guiar a los desarrolladores que son nuevos en el uso de Vue. Desde conocimientos básicos hasta empaquetado convencional y análisis de código fuente, así como muchos casos prácticos, es un buen libro práctico. El contenido principal incluye enlace de datos, instrucciones, enlace de control de formularios, filtros, componentes, validación de formularios, comunicación de servicios, enrutamiento y vistas, vue-cli, desarrollo y depuración de pruebas, análisis de código fuente y herramientas de construcción y empaquetado convencionales. El libro tiene un contenido completo, una explicación detallada y muchos ejemplos, y es adecuado para desarrolladores de todos los niveles.

6. "La belleza de la programación"

No importa en qué posición se encuentre un programador, este es un libro de lectura obligada. Los programadores que no han leído este libro son casi todos falsos. programadores. Este libro tiene 60 preguntas sobre algoritmos y programación. La mayoría de estas preguntas han aparecido en exámenes escritos y entrevistas en los últimos años, o han sido discutidas acaloradamente por los empleados de Microsoft. El autor intenta partir de varios problemas interesantes del libro para guiar a los lectores a descubrir problemas, analizarlos, resolverlos y encontrar mejores soluciones. Puede mejorar enormemente su pensamiento en programación y su pensamiento en profundidad sobre esta industria y, eventualmente, convertirse en un experto técnico.

Ruta de aprendizaje:

Fase 1: Reconstrucción de la página front-end (4 semanas)

El contenido incluye: (Proyecto de maquetación de sitio web para PC, HTML5+CSS3 Básico proyecto, proyecto de maquetación de páginas WebApp)

Fase 2: Programación avanzada en JavaScript (5 semanas)

El contenido incluye: (proyecto de desarrollo de funciones interactivas JavaScript nativas, avanzadas orientadas a objetos y ES5/ Proyectos de aplicaciones ES6, biblioteca de herramientas JavaScript, proyectos de investigación y desarrollo independientes)

Fase 3: desarrollo de proyectos full-stack del lado de la PC (3 semanas)

El contenido incluye: (jQuery classic interactivo desarrollo de efectos especiales), protocolo HTTP, proyectos de desarrollo avanzado Ajax y PHP/JAVA, proyectos de aplicaciones modulares y de ingeniería front-end, proyectos de desarrollo de sitios web del lado de la PC, proyectos de desarrollo front-end del sistema de información de gestión del lado de la PC)

Fase 4: Desarrollo del proyecto Mobile End (6 semanas)

El contenido incluye: (Proyecto táctil final, proyecto de escena WeChat, aplicación de Angular+Ionic para desarrollar el proyecto WebApp, aplicación de Vue.js para desarrollar Proyecto WebApp, aplicación de React.js para desarrollar proyecto WebApp)

Fase 5: Desarrollo híbrido (Hybrid, ReactNative) (1 semana)

El contenido incluye: (Desarrollo de subprogramas WeChat, ReactNative , desarrollo de varias aplicaciones híbridas)

Fase 6: Desarrollo de pila completa de NodeJS (1 semana)

El contenido incluye: (Desarrollo del sistema back-end de WebApp, 1, conceptos básicos de NodeJS y núcleo de NodeJS módulo 2, Express 3, base de datos noSQL)

Video tutorial:

Lo anterior es una breve introducción al viaje de aprendizaje de los principiantes en front-end web realizada por Shangxuetang Front-end Academy.

En general, además de comprender la dinámica y el desarrollo de toda la industria del front-end, los principiantes que no tienen conocimientos básicos de front-end web también deben aprender HTML, CSS, JavaScript y otros conocimientos. Es un sistema técnico grande y complejo.

Si está interesado en aprender tecnología front-end y desea aprender una nueva tecnología, le proporcionaré un muy buen intercambio de aprendizaje front-end qun: 1141884931. Si tienes alguna duda, pregúntame por dentro, para evitar muchos desvíos y hacerlo de forma más eficiente. Recuerda comunicarte más con gente experimentada y no trabajar a puerta cerrada. Si no hay un tutorial mejor, no dudes en pedírmelo.

Este artículo fue creado originalmente por Shangxuetang Front-end Academy. ¡Bienvenido a prestar atención y llevarlo a aprender conocimientos de front-end web!