Localhost:3000 es un puerto predeterminado utilizado por los servidores web. Es un servidor de desarrollo local que sigue corriendo puerto 3000 . Es muy utilizado por desarrolladores experimentados, principiantes e intermedios cuando trabajan en una aplicación web. Los desarrolladores utilizan localhost:3000 para ver la vista previa de la aplicación desarrollada y probarla de acuerdo con los requisitos de capacidad de respuesta y otros parámetros antes de implementarla en producción.
Entendamos localhost:3000 desglosándolo:
- servidor local: Se refiere al nombre de host o al dispositivo actual que está utilizando con fines de desarrollo.
- 3000: Es el número de puerto en el que el servidor de desarrollo creado está configurado para escuchar.
Profundicemos en el concepto de localhost:3000 entendiendo los siguientes puntos uno por uno:
¿Cómo iniciar el servidor localhost:3000 en su máquina?
Para iniciar el servidor localhost:3000 debe tener un servicio que opere en el puerto localhost:3000 como reaccionarjs , NodoJS , VueJS , angularjs , etc. Si está trabajando con alguno de los servicios mencionados, debe escribir un comando dentro de la terminal de su IDE o símbolo del sistema según el servicio que esté utilizando.
¿Dónde encuentro la configuración de mi navegador?
Los comandos para diferentes servicios se enumeran a continuación:
- Nodo.js : Si tiene node.js instalado en su máquina con Administrador de paquetes de nodo (npm). Puedes utilizar herramientas como servidor http o servidor en vivo para iniciar el servidor de desarrollo localhost:3000 con la ayuda de los siguientes comandos:
// Install tools globally npm install -g http-server/liver-server // Navigate to your project cd pathOfYourProject // Start the server at port:3000 http-server/live-server -p 3000>
- reaccionarjs : En el caso de ReactJS, no es necesario instalar el servidor externamente. Si está creando una aplicación de reacción usando crear-reaccionar-aplicación crea automáticamente un servidor de desarrollo. Solo necesita ejecutar los siguientes comandos para iniciar el servidor.
// Navigate to your project directory cd pathOfYourProject // Start the server npm start>
- angularjs : La aplicación angular también viene con un servidor de desarrollo, solo necesita crear una aplicación angular usando Angular CLI y ejecutar los siguientes comandos.
// Navigate to your project directory cd pathOfYourProject // Start the server ng serve //By default, angular app run on port 4200 use below command to change it ng serve --port 3000>
Cómo crear un servidor de desarrollo en reaccionarjs ?
Siga los pasos a continuación para crear e iniciar el servidor de desarrollo en ReactJS:
- Paso 1: Crea una aplicación de reacción usando el npm crear-reaccionar-aplicación comando especificando el nombre del proyecto después de él.
npm create-react-app projectName>
- Paso 2: Navegue a la carpeta de su proyecto actual.
cd pathToYourProject>
- Paso 3: Crea archivos dentro del src carpeta y ejecute el servidor usando el siguiente comando.
npm start>
Ejemplo: El siguiente código se puede utilizar como código de plantilla para su archivo.
JavaScript
// App.js file> import React, { useState } from>'react'>;> const App = ({ prop }) =>{> >const [isHidden, setIsHidden] = useState(>false>)> >function> btnClickHandler() {> >setIsHidden((prev) =>!anterior);> >}> >return> (> >'center' }}>Bienvenido a techcodeview.com { isHidden && Un portal de informática. } estilo={ { backgroundColor: 'green', color: '#fff', relleno: '15px', cursor: 'pointer', borde: 'none', borderRadius: ' 10px' }}> Haga clic para alternar más contenido de la página { isHidden && Este contenido se alterna dinámicamente mediante un evento de clic con botón. } ); }; exportar la aplicación predeterminada;> |
>
>
Producción:
