Skip to content

Latest commit

 

History

History
77 lines (51 loc) · 3.68 KB

3-editor-codigo.md

File metadata and controls

77 lines (51 loc) · 3.68 KB
Raw

EDITOR DE CODIGO

Elegir un Editor de Texto

Elegir un buen editor de texto es crucial para el desarrollo web eficiente. Los editores de texto modernos ofrecen muchas características útiles como resaltado de sintaxis, autocompletado, depuración y administración de proyectos. Algunos de los editores de texto más populares son:

1. Visual Studio Code (VS Code)

  • Desarrollado por: Microsoft
  • Características: Resaltado de sintaxis, autocompletado, integración con Git, extensiones, terminal integrado.
  • Plataformas: Windows, macOS, Linux.
  • URL de descarga: Visual Studio Code

2. Sublime Text

  • Desarrollado por: Sublime HQ
  • Características: Resaltado de sintaxis, autocompletado, múltiples selecciones, modo sin distracciones.
  • Plataformas: Windows, macOS, Linux.
  • URL de descarga: Sublime Text

3. Notepad++

  • Desarrollado por: Don Ho
  • Características: Ligero, resaltado de sintaxis, autocompletado, búsqueda y reemplazo avanzados.
  • Plataformas: Windows.
  • URL de descarga: Notepad++

Recomendación

Para el propósito de este curso, recomendamos usar Visual Studio Code (VS Code) debido a su amplia gama de características, extensibilidad y comunidad activa.

Configuración Básica de VS Code

Visual Studio Code es un editor de código fuente ligero pero potente que se puede personalizar con una gran variedad de extensiones. A continuación, se describen los pasos para configurarlo inicialmente:

1. Instalación de VS Code

  1. Visita el sitio web oficial de Visual Studio Code.
  2. Descarga la versión adecuada para tu sistema operativo (Windows, macOS, Linux).
  3. Ejecuta el archivo descargado y sigue las instrucciones del instalador.

2. Configuración Básica

Una vez que hayas instalado VS Code, puedes seguir estos pasos para la configuración básica:

Instalación de Extensiones

Las extensiones añaden funcionalidades a VS Code. Aquí hay algunas extensiones recomendadas para el desarrollo web:

  1. HTML Snippets: Proporciona fragmentos de código (snippets) útiles para HTML.
  2. CSS IntelliSense: Mejora el autocompletado para CSS.
  3. JavaScript (ES6) code snippets: Añade fragmentos de código para JavaScript ES6.
  4. Live Server: Inicia un servidor local con recarga automática para el desarrollo web.

Para instalar una extensión:

  1. Haz clic en el icono de extensiones en la barra lateral izquierda (o presiona Ctrl+Shift+X).
  2. Escribe el nombre de la extensión que deseas instalar en el campo de búsqueda.
  3. Haz clic en "Install" para instalar la extensión deseada.

Configuración del Tema y el Editor

  1. Tema: Puedes cambiar el tema de color de VS Code para hacerlo más cómodo visualmente.

    • Ve a File > Preferences > Color Theme (o presiona Ctrl+K Ctrl+T).
    • Selecciona el tema que prefieras de la lista.

  2. Configuración del Editor:

    • Ve a File > Preferences > Settings (o presiona Ctrl+,).
    • Algunas configuraciones recomendadas:
      • "editor.tabSize": 2: Establece el tamaño de las tabulaciones en 2 espacios.
      • "editor.wordWrap": "on": Habilita el ajuste de línea para evitar el desbordamiento horizontal.
      • "files.autoSave": "afterDelay": Guarda automáticamente los cambios después de un breve retraso.

Lección Anterior

Leccion 1.4