Cómo los estudiantes universitarios pueden aprender de manera integral el desarrollo front-end
Objetivo de aprendizaje: estudiantes de nivel 0 que aman Internet y desean participar en el desarrollo front-end y el desarrollo full-stack de H5;
La primera etapa de los principios básicos de Internet y HTML
Fundamentos de Internet, conceptos de servidores, navegadores y solicitudes HTTP. Introducción a las herramientas de programación y HTML. Etiquetas semánticas HTML, etiquetas P, etiquetas de la serie H. Comprensión profunda del esqueleto básico de HTML, el esqueleto de HTML y las diferencias entre HTML y XHTML. Etiqueta de metainformación meta, establecer palabras clave de la página, juego de caracteres, palabras clave, descripción de la página. Una etiqueta y una etiqueta img, ruta relativa y ruta absoluta. Introducción a las etiquetas ul, ol, dl, div y span, así como a las etiquetas HTML menos utilizadas. Formulario, enviar acción de formulario, enviar método, insertar objeto de formulario. Comentarios HTML, entidades de caracteres HTML.
Habilidades básicas y avanzadas de CSS segunda etapa
Selector. Propiedades del texto, propiedades del color. Herencia y cascada, cálculo de peso. Modelo de cuadro CSS, ancho, alto, relleno, borde, propiedades de margen. El modelo anidado padre-hijo utiliza Fireworks para restaurar con precisión los dibujos de diseño. Flotadores Propiedades de flotadores, significado de los flotadores y métodos para borrarlos. Compatibilidad del navegador, trucos de CSS. Propiedades de series de fondo, asistente CSS, transparencia de páginas web. Pseudoclase para hipervínculos y barras de navegación. Posicionamiento de ubicación, indicaciones de posicionamiento. Diseño DIV+CSS.
La tercera etapa del proyecto de producción de sitios web estáticos
A través de las dos etapas de aprendizaje anteriores, alcanzará el nivel de creación de páginas web y cumplirá con los requisitos de aprendizaje. Debe dominar el concepto de optimización de motores de búsqueda, técnicas comunes de SEO para páginas y aprender a crear páginas elegantes. Icono de fuente de fuente de icono. Algunas habilidades CSS avanzadas comunes, como márgenes negativos, tecnología de prensado de líneas, puertas correderas y tecnología de columnas autoportantes. Para sitios web con diseños más complejos, debes aprender a crear de 2 a 3 páginas. Métodos populares de producción de sitios web, como pancartas y fondos grandes. Apreciación y producción de sitios web empresariales de alta calidad
La cuarta etapa de los conceptos básicos de JavaScript
Declaraciones, secuencia de ejecución, estructura de vocabulario, identificadores, palabras clave, variables, constantes, declaraciones de alarma y consolas. Valores y variables, números, texto, valores booleanos, valores nulos y valores indefinidos. Expresiones y operadores, descripción general de operadores. Control de procesos, declaraciones de asignación, declaraciones de juicio condicional, declaraciones if, anidamiento de declaraciones if, declaraciones de cambio, declaraciones de control de bucle, declaraciones while, declaraciones do... while y bucles for. Declaraciones de salto: declaración de continuación, declaración de interrupción. Funciones, parámetros, valores de retorno, recursividad, alcance, variables globales, variables locales. Objetos internos, matrices, cadenas.
La quinta etapa de la programación DOM de JavaScript
Descripción general de eventos y procesamiento de eventos, eventos y nombres de eventos, eventos comunes, invocación de controladores de eventos, modelo de eventos DOM, flujo de eventos, objetos de eventos , Registrar y eliminar eventos. Las propiedades públicas, métodos, eventos y datos de salida del objeto de documento. Tres elementos del evento. Objetos DOM, descripción general de DOM, jerarquía DOM, niveles DOM, propiedades de nodo de objetos DOM, recorrido por el árbol de documentos, clonación, eliminación y reemplazo. Conocimientos básicos de animación, temporizadores, setInterval y setTimeout, efectos de movimiento, animación práctica y casos de creación de efectos de movimiento.
La sexta etapa de los efectos especiales de la página jQuery
Objetos JQuery y objetos DOM, selectores jQ, operaciones CSS, configuración y obtención de HTML, texto y valores. Eventos, carga de DOM, enlace de eventos, eventos compuestos, propiedades de objetos de eventos. Animación, método de animación personalizado, función de devolución de llamada de animación, detener animación, otros métodos de animación. Operaciones JQuery sobre formularios y tablas y más aplicaciones, aplicaciones de formularios y aplicaciones de tablas. Complemento JQuery, jQueryUI, jQuery facilidad, jQuery mousewheel, etc. ¡Súper efecto de varias páginas! Aprenda sobre el uso de complementos jQuery a través de estudios de casos.
Etapa 7 de JavaScript avanzado
Espacio de nombres, extensión de objetos, matriz, mecanismo introducido por los marcos principales: procesamiento listo para DOM y sin conflictos. Módulos de lenguaje, expansión y reparación de cadenas, expansión y reparación de matrices, expansión y reparación numérica, expansión y reparación de funciones, expansión y reparación de fechas, rastreo de navegador y detección de características, determinación de navegador, detección de soporte de eventos y detección de soporte de estilo. Fábrica de clases, soporte de JavaScript para clases, implementación de varias fábricas de clases. Los métodos integrados del navegador para buscar elementos, el módulo de atributos y cómo distinguir entre atributos inherentes y atributos personalizados.
La octava etapa de HTML5 y CSS3
Descripción general de HTML5, nuevas características de HTML5, organización de HTML5, composición de HTML5, características de las páginas HTML5, conceptos básicos de HTML, atributos globales de HTML5, HTML5 Otras funciones, clasificación de elementos HTML5. Formularios HTML5 prácticos con nuevos tipos de entrada. Audio y vídeo HTML5, una descripción general de las tecnologías multimedia HTML5, reproducción de audio en HTML5. Estándares de codificación CSS3, comprenda las nuevas características de CSS3. Selector de CSS, selector de atributos, selector de pseudoclase estructural, selector de pseudoclase de UI. Animación de rotación, animación de escala, animación en movimiento, animación de inclinación. Geniales efectos de animación en 3D en combate real.
Fase 9: Web Móvil y Web Responsive
Vista, escalado, resolución, resolución física, relación de píxeles del dispositivo, dppx y dpi, meta vista. Diseño porcentual, diseño de flujo, nuevo modelo de caja de flujo CSS3. Eventos táctiles y de puntero, eventos táctiles, eventos de gestos, otros eventos, arrastrar y soltar, capas de desplazamiento, eventos y modos de interacción e interacciones móviles. Marcos móviles comunes como zepto.js y jQuery Mobile. Marco móvil rápido HTML5. Arranque3. Ajuste los puntos de interrupción para las barras de navegación receptivas. Prioridad móvil, sistema grid Bootstrap, principios del sistema grid, interacción JavaScript en Bootstrap, desarrollo ágil Bootstrap.
La décima etapa del conocimiento del servidor y la introducción a PHP
La diferencia entre el lenguaje de fondo y el lenguaje de primer plano. Comprenda PHP, las ventajas del lenguaje PHP, las nuevas características de PHP 5, las tendencias de desarrollo de PHP y los campos de aplicación de PHP. Herramientas de creación y desarrollo de entornos PHP. Conceptos básicos del lenguaje PHP, variables PHP, operadores PHP, expresiones PHP, especificaciones de codificación PHP, declaraciones de control de flujo, operaciones de cadenas, matrices PHP e interacción entre PHP y páginas web. Descripción general de la tecnología de bases de datos, agregar, eliminar y verificar.
La undécima fase del desarrollo práctico de proyectos empresariales Ajax
Descripción general y experiencia de Ajax, introducción a la tecnología Ajax, explicación detallada del objeto XMLHttpRequest, carga dinámica y visualización de datos, descripción general del objeto XMLHttpRequest , métodos, propiedades, solicitudes de envío, solicitudes GET y POST, ciclo de ejecución, uso de respuesta JSON, paquete de utilidades Ajax. Análisis JSON, motor de plantilla subrayado, tecnología de plantilla, página de ensamblaje dinámico, consulta de ubicación de número de teléfono, código de verificación, etc. Combate Ajax, programa de validación de formularios avanzado Ajax, menú de enlaces dinámicos Ajax, flujo en cascada.
La duodécima etapa de JavaScript está orientada a objetos.
Crear objetos, consultar y establecer propiedades, eliminar propiedades, detectar propiedades, enumerar propiedades, captadores y definidores de propiedades, propiedades de propiedades, tres propiedades de objetos, objetos serializados y métodos de objetos. Clases y módulos, clases y prototipos, clases y constructores, extensiones de clases, clases y tipos, subclases. Prototipo, creación de instancias y prototipo, creación de instancias de objetos, juzgar objetos por constructor, herencia y cadena de prototipos, constructor y objeto prototipo, constructor, objeto prototipo, atributo [[Prototype]], usar el objeto prototipo en el constructor, cambiar el objeto Prototipo, el objeto prototipo de objetos incorporados.
La decimotercera etapa Animación de lienzo y juegos móviles
Dibujo de lienzo, conocimientos básicos, comprensión del sistema de coordenadas del lienzo, obtención del contexto del entorno del lienzo, comprensión de rutas, API de operación de rutas, dibujo de líneas, dibujo de rectángulo, dibujo de arco, dibujo de curva de Bézier, atributos de línea, color de línea, relleno, estado del dibujo. Image API, utiliza lienzo para dibujar imágenes, coordinar transformaciones y dibujar texto.
Principios del juego, creación de motores de juegos 2D, comprensión de los bucles del juego, implementación del motor de renderizado, uso de motores para crear instancias de juegos y algoritmos de juegos comunes.
La decimocuarta etapa del desarrollo del proyecto empresarial Node.js
Características del nodo, E/S asíncrona, eventos y funciones de devolución de llamada, subproceso único, multiplataforma, escenarios de aplicación de nodo, I/ O intensivo, especificación CommonJS, implementación del módulo de nodo, análisis de ruta y ubicación de archivos, compilación del módulo, módulo central, proceso de compilación del módulo central de JavaScript, programación de red, construcción de servicios TCP. Cree servicios HTTP, servicios WebSocket, servicios de red y seguridad. MongoDB, Express, Mongoose, socket.io Pequeño sistema Weibo, Tetris. Usando Linux.
La decimoquinta etapa del mini programa Alphabet
Descripción general del mini programa, registro de la cuenta de desarrollo del mini programa, obtención del AppId para descargar y uso de herramientas de desarrollo, comprensión de la estructura de carpetas predeterminada, configuración de appjson , paréntesis dobles Modo Difhe MVVM, número de operación del mini programa, inicio de API del mini programa, paleta de colores del caso, cuadro de publicación de Weibo del caso, instrucción de bucle for, instrucción de juicio y grupo de botones de verificación, apertura del servidor Alibaba Cloud, número de solicitud de servicio y envío de número de cambio , Obtenga casos de flujo de información de solicitudes, solicitudes de publicaciones y carga de imágenes, y base de datos Mogo.
Fase 16 ECMAScript2016
Introducción, comandos let y const, desestructuración y asignación de variables, expansión de cadenas, expansión regular, expansión numérica, expansión de matrices, expansión de funciones, expansión de objetos, símbolos, recopilación y mapeo de estructuras de datos, proxies, reflexión, iteradores y bucles for, funciones generadoras, objetos Promise, operaciones asincrónicas y funciones asincrónicas, clases, decoradores, módulos y más.
Etapa 17 Yeoman Scaffolding
Instalación básica, configuración, plantillas HTML, compresión de imágenes, herramientas de compilación, administradores de paquetes, pruebas JSLint.
Etapa 18 Herramientas de construcción de Grunt y Swallow
GIT, SVN, Grunt, Gulp, Webpack A través de una estrategia de código sobre configuración, Gulp hace que las tareas simples sean simples y las tareas complejas se vuelvan manejables. . Con el poder del flujo de Node.js, los proyectos se pueden construir rápidamente y se pueden reducir las operaciones de E/S frecuentes. Con una API mínima, dominar Gulp es sencillo y el trabajo de construcción está bajo control: como una serie de canalizaciones.
Etapa 19 Sass, Less y Stylus
Las variables se pueden definir en sass para modificación y mantenimiento unificados. Utilice selectores anidados de Sass para expresar relaciones jerárquicas. Utilice sass para importar otros archivos sass y finalmente compílelos en un archivo css. Algunos fragmentos de código están definidos por los mixins disponibles en sass y se pueden pasar parámetros para facilitar llamadas posteriores según las necesidades.
En la vigésima etapa, React.js construye componentes de vista.
Introducción a React, JSX, ciclo de vida de componentes, creación de instancias, flujo de datos, procesamiento de eventos, síntesis de componentes, mixin, manipulación DOM, animación, optimización del rendimiento, renderizado del lado del servidor y bibliotecas de clases periféricas. Plantillas de datos VUE, ciclo de vida, filtros.
Biblioteca front-end de interfaz VUE Stage 21.
Conozca Vue.js, enlace de datos, directivas, propiedades calculadas, enlace de control de formulario, filtros, enlace de clases y estilos, transiciones, eventos de enlace, componentes, validación de formularios, validación de grupos y comunicación con el servidor, llamadas RESTful. .
Fase 22 Marco móvil local de React
Introducción a React Native, base de desarrollo de React Native, introducción y práctica de componentes comunes, componente TextInput, implementación de Jiugongge, componente NavigatorIOS, componente de clase Touchable , Pensamiento de la máquina de estado y variables de la máquina de estado, comprensión profunda del proceso de representación de la interfaz de usuario, el mecanismo de trabajo del componente Navigator, los conceptos básicos del desarrollo híbrido, el ciclo de vida del componente y los pasos de implementación y almacenamiento de datos de React Native. aplicaciones.
Fase 23 Córdoba y PhoneGap
Usa acelerómetro y sensor de posición, sistema de archivos, almacenamiento y base de datos local, procesa audio, imagen y vídeo, procesa libreta de direcciones y Eventos locales, usando XUI, Desarrollo de interfaz de usuario con jQuery Mobile, extensiones de complementos PhoneGap, herramientas de desarrollo y pruebas.
La vigésima cuarta etapa del marco Ionic
Introducción a las aplicaciones Ionic e híbridas, configuración del entorno de desarrollo, navegación Ionic y componentes principales, pestañas, lista avanzada y componentes de formulario, aplicaciones avanzadas Desarrollo, uso de agente de línea de comandos Ionic, uso de ionScroll en páginas, filtros: conversión de datos en vistas.
Artículo 26 Sistema de Gestión de Versiones y Prueba de Empaquetado de Proyectos
Fase 27 Ataque y Defensa Front-end, Despliegue y SEO
Fase 28 WebGL y Three.js
Etapa 29 TypeScript y Ángulo 4