Preguntas de la entrevista sobre el entorno de desarrollo

Sobre el entorno de desarrollo

• El entrevistador quiere comprender la situación laboral real del candidato a través del entorno de desarrollo.
• Las herramientas del entorno de desarrollo pueden reflejar la eficiencia del trabajo.
• Será principalmente en forma de chat y no hará preguntas específicas.

Entorno de desarrollo

Conceptos básicos de Git

¿Qué es la gestión de versiones?

La gestión de versiones es una forma de registrar los cambios en los archivos para que pueda comprobar el contenido de una versión específica del archivo en el futuro.

Problemas con el mantenimiento manual de versiones de documentos

Una gran cantidad de documentos y un nombre poco claro generan confusión en la versión del documento.
Cada vez que edita un documento, debe copiarlo, lo cual es un inconveniente. Si
varias personas editan el mismo documento al mismo tiempo, es fácil sobrescribirlo .

Que es Git

Git es un sistema de control de gestión de versiones (abreviado como VCS). Puede guardar el estado del documento como un registro de actualización en cualquier momento, o puede restaurar el registro de actualización en cualquier momento.

Instalación de Git

enlace de descarga

Flujo de trabajo básico de Git

repositorio de git	caché de almacenamiento	Lista de trabajo
Se utiliza para almacenar registros de envíos.	Almacenamiento temporal de archivos modificados	Directorio de proyectos administrado por Git

Configuración de Git antes de su uso

Antes de usar git, debe decirle a git quién es usted y debe usarlo cuando envíe al repositorio de git.

1. Configurar el nombre del remitente: git config --global user.name nombre del remitente
2. Configurar el nombre del remitente: git config --global user.email buzón del remitente
3. Ver información de configuración de git: git config --list (respectivamente Ver usuario de configuración de git .name || git config user.email)

Nota

1. Si desea modificar la información de configuración, repita el comando anterior.
2. La configuración solo debe realizarse una vez.

Pasos de envío

1.git init inicializa el almacén de git (Command + Shift +. En mac puede mostrar archivos ocultos)
2.git estado ver el estado del archivo
3.git agregar archivo de seguimiento de la lista de archivos
4.git commit -m enviar información para enviar el código al almacén
5 .git log Ver registro de envío

Revocar

• Sobrescriba los archivos en el directorio de trabajo con los archivos en el área de almacenamiento temporal: git checkout nombre de archivo
• Elimina el archivo del área de ensayo: git rm --cached file name
• Restaure el registro de actualización especificado en el almacén de git y sobrescriba el área de ensayo y el directorio de trabajo: git reset --hard commitID
  

Rama

Para facilitar la comprensión, puede pensar temporalmente en una rama como una copia del código en el directorio de trabajo actual.
El uso de ramas nos permite separarnos de la línea principal de desarrollo, para no afectar la línea principal de desarrollo.

Desglose de la rama

1. Rama maestra (maestra): una rama que se genera automáticamente cuando se envía un registro de actualización al repositorio de git por primera vez.

2. Rama de desarrollo (desarrollar): Como rama de desarrollo, se crea en base a la rama maestra.

3. Característica: Como rama para desarrollar funciones específicas, se crea en base a la rama de desarrollo.

Rama de funciones -> Rama de desarrollo -> Rama principal

Comando de rama

• git branch Ver rama
• git branch Nombre de rama crear rama
• git checkout Rama de cambio de nombre de sucursal
• git mergeRama de fusión de la rama de origen (Nota: debe estar en la rama maestra para fusionar la rama de desarrollo)
• git branch -dNombre de rama eliminar rama (eliminar solo después de fusionar la rama) (-D forzar eliminación)

Guardar cambios temporalmente

En git, todos los cambios en la rama se pueden extraer y almacenar temporalmente, de modo que los desarrolladores puedan obtener una copia de trabajo limpia y cambiar temporalmente a otro trabajo.
Escenario de uso: cambio temporal de sucursales

• Almacenar cambios temporales:git stash
• Restaurar cambios:git stash pop

Herramientas de depuración

La depuración es una parte esencial del proceso de desarrollo. Las herramientas de depuración son aquellos programas que nos permiten monitorear, controlar y corregir otros programas. Pueden ayudarnos a encontrar rápidamente la causa del problema y, en última instancia, lograr el objetivo de mejorar la eficiencia del desarrollo. Este artículo recomendará varias herramientas de depuración de programas más populares para diferentes desarrolladores. Si tiene otras opciones mejores, deje un mensaje en el área de comentarios para que más desarrolladores aprendan y discutan.

GDB

官方网站: https: //www.oschina.net/p/gdb

GDB (depurador simbólico GNU) es un depurador potente que puede depurar varios idiomas. Una cosa a tener en cuenta es que GDB es un depurador, no un entorno integrado como VC. Puede utilizar algunas herramientas de front-end como XXGDB, DDD, etc. Todos tienen una interfaz gráfica, por lo que es más cómodo de usar.

Livepool

官方网站: https: //www.oschina.net/p/livepool

LivePool es una herramienta de depuración y desarrollo web basada en NodeJS y similar a Fiddler que admite la captura de paquetes y el reemplazo local. Es un conjunto de prácticas WorkFlow y soluciones de depuración resumidas por Tencent AlloyTeam durante el proceso de desarrollo y práctica.

Aleación Palanca

官方网站: https: //www.oschina.net/p/alloylever

AlloyLever es una herramienta de depuración y desarrollo web de código abierto del equipo AlloyTeam de Tencent. Sus funciones incluyen principalmente:

1: La consola generará todos los mensajes de error (errores de secuencia de comandos y errores de solicitud de red)
2: La consola generará todos los registros impresos por los usuarios, como la consola. [Log / error / info / debug / debug]
3: El panel XHR generará todos (XMLHttpRequest ) Solicitud AJAX y los datos devueltos por el servidor
4: El panel Recursos generará toda la información de las cookies y LocalStorage
5: El panel TimeLime generará la situación que consume mucho tiempo del período de tiempo en el ciclo de vida de la página.

CmBacktrace

官方网站:www.oschina.net/p/cmbacktrace

CmBacktrace (Cortex Microcontroller Backtrace) es una biblioteca de código abierto para el seguimiento automático y la localización de códigos de error de las MCU de la serie ARM Cortex-M y el análisis automático de las causas de error.

vConsole

官方网站: https: //www.oschina.net/p/vconsole

vConsole es un panel de depuración de front-end creado por el equipo de front-end de la plataforma pública WeChat para resolver el problema de la visualización de registros en el teléfono móvil.

En la actualidad, vConsole viene con dos paneles, el predeterminado es el panel "Registro", responsable de mostrar el registro. Al igual que las herramientas de desarrollo en el lado de la computadora, los desarrolladores pueden llamar a diferentes métodos para escribir diferentes colores para distinguir rápidamente los tipos de registro; el segundo es el panel "Sistema", vConsole imprimirá automáticamente cierta información básica (como la versión del sistema) para facilitar a los desarrolladores la localización de problemas.

Cartero

官方网站:https://www.oschina.net/p/postman

Postman es una extensión de Chrome que proporciona una potente API web y depuración de solicitudes HTTP. Puede enviar cualquier tipo de solicitud HTTP (GET, HEAD, POST, PUT ...) con cualquier número de parámetros + encabezados.

Capturar

Wireshark es un software de análisis de paquetes de red muy popular con funciones muy poderosas. Se pueden interceptar varios paquetes de red y se puede mostrar información detallada de los paquetes de red. Las personas que usan Wireshark deben comprender el protocolo de red, de lo contrario, no lo entenderán.

Por razones de seguridad, Wireshark solo puede ver paquetes, pero no puede modificar el contenido de los paquetes o enviar paquetes.

Wireshark puede obtener HTTP y HTTPS, pero no puede descifrar HTTPS, por lo que Wireshark no puede entender el contenido de HTTPS. En resumen, si está trabajando con HTTP, HTTPS o usa Fiddler, otros protocolos como TCP y UDP usan Wireshark.

wirehark comienza a capturar paquetes

Interfaz de inicio

Wireshark captura los paquetes de red de una determinada tarjeta de red en la máquina. Cuando hay varias tarjetas de red en su máquina, debe seleccionar una.

Haga clic en Caputre-> Interfaces ... Aparece el siguiente cuadro de diálogo, seleccione la tarjeta de red correcta. Luego haga clic en el botón "Inicio" para comenzar a capturar paquetes

Introducción a la ventana de Wireshark

WireShark se divide principalmente en estas interfaces

1. Filtro de visualización (filtro de visualización), utilizado para filtrar

2. Panel de lista de paquetes (lista de paquetes), muestra los paquetes capturados, la dirección de origen y la dirección de destino, el número de puerto. Diferentes colores, que representan

3. Panel de detalles del paquete, que muestra los campos del paquete

4. Panel de disector (datos hexadecimales)

5. Misceláneo (barra de direcciones, varios)

Página 2 Filtrado de pantalla de Wireshark

Es muy importante utilizar el filtrado. Cuando los principiantes utilizan wirehark, obtendrán mucha información redundante, en miles o incluso decenas de miles de registros, es difícil encontrar la pieza que necesitan. Hazlo mareado.

Los filtros nos ayudarán a encontrar rápidamente la información que necesitamos en una gran cantidad de datos.

Hay dos tipos de filtros,

Uno es el filtro de visualización, que es el de la interfaz principal, que se utiliza para encontrar el registro requerido en el registro capturado.

Uno es el filtro de captura, que se utiliza para filtrar los paquetes capturados para no capturar demasiados registros. Establecer en Captura -> Filtros de captura

Guardar filtro

En la columna Filtro, después de completar la expresión del Filtro, haga clic en el botón Guardar y dé un nombre. Por ejemplo, "Filtro 102",

Hay un botón adicional "Filtro 102" en la barra de Filtro.

Reglas para filtrar expresiones

Reglas de expresión

1. Filtrado de protocolos

Por ejemplo, TCP, solo se muestra el protocolo TCP.

2. Filtrado de IP

Por ejemplo, ip.src == 192.168.1.102 muestra que la dirección de origen es 192.168.1.102,

ip.dst == 192.168.1.102, la dirección de destino es 192.168.1.102

tcp.port == 80, el puerto es 80

tcp.srcport == 80, solo muestra el puerto deseado del protocolo TCP como 80.

4. Filtrado en modo http

http.request.method == “GET”, solo muestra el método HTTP GET.

5. El operador lógico es Y / O

Expresiones de filtro de uso común

Expresión de filtro	usar
http	Ver solo los registros del protocolo HTTP
ip.src 192.168.1.102 o ip.dst192.168.1.102	La dirección de origen o destino es 192.168.1.102

Panel de lista de paquetes

El panel de la lista de paquetes muestra el número, la marca de tiempo, la dirección de origen, la dirección de destino, el protocolo, la longitud y la información del paquete. Puede ver que los diferentes protocolos se muestran en diferentes colores.

También puede modificar estas reglas de color de visualización, Ver -> Reglas de coloración.

paquete web babel

Cuando usamos babel en webpack, primero debemos instalar babel-core, que es el paquete principal de la biblioteca de compilación de babel.
Si algún código necesita llamar a la API de Babel para la transcodificación, se debe usar el módulo babel-core.

npm install babel-core --save-dev

Después de eso, para el archivo js en webpack, debemos compilarlo y configurarlo. En webpack, debe usar babel-loader para ayudarlo a usar babel.

npm install babel-loader --save-dev

Entonces, en webpack.config.js, debe escribir el siguiente código:

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader'
    },
    exclude: '/node_modules/'
  }
]

Entonces tenemos que entender el concepto de preset, es decir, antes de que se compile Babel, Babel necesita conocer sus reglas de compilación y qué tipo de especificaciones se utilizan para compilar.

Por ejemplo, si necesito compilar de acuerdo con el estándar es6, entonces instalas un babel-preset-es2015. De manera similar, si quieres compilar de acuerdo con es7, entonces instalas babel-preset-es2016:

npm install babel-preset-es2016 --save-dev

En términos generales, si desea compilar con las últimas especificaciones, simplemente instale babel-preset-env directamente. Contiene babel-preset-es2015, babel-preset-es2016 y babel-preset-es2017, que son equivalentes a babel-preset -Último (obsoleto), puede compilar todos los códigos en la última especificación:

npm install babel-preset-env --save-dev

Con las reglas de compilación seguimos configurando webpack. En babel-loader, podemos agregar parámetros de configuración:

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader',
      options: {
    
    
        presets: ['env']  // 也可以写成presets:['babel-preset-env']
      }
    },
    exclude: '/node_modules/'
  }
]

En este punto, al empaquetar, babel compilará automáticamente nuestro código de acuerdo con las últimas especificaciones gramaticales.

Entonces la pregunta es, ¿cómo llamamos a nuestra compilación de código? Si es un proyecto que solo requiere compatibilidad con el navegador Chrome, Chrome soporta muy bien mucha sintaxis es6, por lo que no hay necesidad de hacer mucha compilación, el código se puede ejecutar bajo Chrome. Si mi proyecto va a ser compatible con una versión de navegador muy baja, entonces la sintaxis de es6, 7, 8 debe compilarse en la sintaxis de es4 o es5. En qué medida se compila, podemos continuar configurándolo a través de los elementos de configuración preestablecidos:

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader',
      options: {
    
    
        presets: [
            ['babel-preset-env', {
    
    
                targets: {
    
    
                    browser: ['> 1%']
                }
            }]
        ],
      }
    },
    exclude: '/node_modules/'
  }
]

En los ajustes preestablecidos, agregamos un elemento de configuración llamado navegador a babel-preset-env, con un valor de> 1%, lo que significa que cuando se usa Babel para compilar, la gramática compilada es compatible con todos aquellos con una participación de mercado de más del 1%. . Navegador. O puedes escribirlo así:

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader',
      options: {
    
    
        presets: [
            ['babel-preset-env', {
    
    
                targets: {
    
    
                    browser: ['chrome']
                }
            }]
        ],
      }
    },
    exclude: '/node_modules/'
  }
]

Cambie el parámetro a Chrome, entonces solo se puede garantizar que el código empaquetado se ejecute normalmente en Chrome. Es difícil decir si otros navegadores pueden ejecutarse, porque el grado de empaquetado que configura es compatible con Chrome.

Los parámetros de configuración de esta parte son muy flexibles, puedes consultar el documento oficial para seguir ajustando: Env preset · Babel

A continuación, continuamos hablando sobre lo que es babel-polyfill. El sitio web oficial de babel escribió una frase muy clara, babel solo se encarga de compilar la gramática. Cuando escribimos una función de flecha, babel te ayudará a compilarla en una función normal. No hay problema. Sin embargo, por ejemplo, si usamos promesa en nuestro código, el código empaquetado por babel es en realidad una promesa. En navegadores de versiones inferiores , promesa No es compatible, pero babel no le ayudará a manejarlo, porque esto no es algo que deba hacerse a nivel de compilación de sintaxis. Las nuevas API que no se convierten incluyen objetos globales como Iterator, Generator, Set, Maps, Proxy, Reflect, Symbol y Promise.

Por lo tanto, si queremos que el código empaquetado sea compatible con los navegadores de versión baja, también debemos considerar la incompatibilidad de los nuevos navegadores de versión baja de sintaxis como promise y Set. En este momento, saldrá babel-polyfill. Solo necesita instalar babel-polyfill globalmente:

npm install --save-dev babel-polyfill

Luego utilícelo en el proyecto, su código no tendrá el problema de compatibilidad que acabamos de mencionar.

import 'babel-polyfill'

Sin embargo, habrá algunas trampas al usar babel-polyfill directamente. El primer pozo está contaminando el entorno global. Por ejemplo, los navegadores de versión baja no tienen un Set, pero babel-polyfill agregará un Set a la variable global. Otro problema es que causará redundancia de código. Por ejemplo, si varios módulos usan Promise, cada módulo puede tener independientemente un código que sea compatible con Promise. Por lo tanto, el uso de babel-polyfill puede resolver el problema de compatibilidad, pero no es la mejor solución. Por lo tanto, aparece babel-plugin-transform-runtime. Con este complemento se puede resolver el problema anterior.

npm install --save-dev babel-plugin-transform-runtime
npm install --save babel-runtime

Instale el complemento primero, y luego instale babel-runtime, después de eso, cambiemos la configuración

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader',
      options: {
    
    
        presets: [
            ['babel-preset-env', {
    
    
                targets: {
    
    
                    browser: ['> 1%']
                }
            }]
        ],
        plugins:['transform-runtime']
      }
    },
    exclude: '/node_modules/'
  }
]

Agregue una configuración de complemento, eso es todo, toda la configuración de babel está casi completa. Finalmente, podemos crear un archivo .babelrc en el directorio del proyecto y poner la configuración de babel en él:

{
    
    
  presets: [['babel-preset-env', {
    
    
    targets: {
    
    
      browser: ['> 1%', 'last 2 versions']
    }
  }]],
  plugins:['transform-runtime']
}

Luego, webpack.config.js se puede reducir a:

rules: [
  {
    
    
    test: /\.js$/,
    use: {
    
    
      loader: 'babel-loader'
    },
    exclude: '/node_modules/'
  }
]

Agregue algunos puntos,

En términos generales, al escribir un marco o una biblioteca usted mismo, usar babel-plugin-transform-runtime es una buena opción, principalmente porque no contamina el medio ambiente. Y si escribe su propio proyecto y no lo usa, es más fácil usar babel-polyfill.

Además, transform-runtime no puede reemplazar completamente a babel-polyfill. Transform no admite métodos de instancia. Por ejemplo, el código: [1, 2, 3] .incluye (3), Array, Object y otros métodos de "instancia" de es6, porque babel-runtime solo admite métodos estáticos.

Además, babel-polyfill y babel-plugin-transform-runtime son independientes, no hay dependencia entre los dos y no tiene sentido no instalar los dos juntos.

Comandos de uso común de Linux

Ver los comandos relacionados con la información del hardware

ifconfig free fdisk ethtool mii-tool dmidecode dmesg lspci

Otros (19)

echo printf rpm yum watch alias unalias date clear history eject time nohup nc xargs exec export unset type

Comandos avanzados de supervisión del rendimiento del sistema (12)

uptime top free vmstat mpstat iostat sar chkconfig

RAM:

top free vmstat mpstat iostat sar

UPC:

top vmstat mpstat iostat sar

E / S:

vmstat mpstat iostat sar

proceso:

ipcs ipcrm lsof strace lstrace

carga:

uptime mount umount df du fsck dd dumpe2fs dump