logo

Localhost 3000

Localhost:3000 on oletusportti, jota web-palvelimet käyttävät. Se on a paikallinen kehityspalvelin joka jatkuu portti 3000 . Sitä käyttävät hyvin usein kokeneet sekä aloittelijat ja keskitason kehittäjät, kun he työskentelevät verkkosovelluksen parissa. Kehittäjät käyttävät localhost:3000:aa nähdäkseen kehitetyn sovelluksen esikatselun ja testatakseen sitä vastevaatimusten ja muiden parametrien mukaisesti ennen sen käyttöönottoa tuotantoon.

Ymmärrämme localhost:3000:n jakamalla se:



  • paikallinen isäntä: Se viittaa isäntänimeen tai nykyiseen laitteeseen, jota käytät kehitystarkoituksiin.
  • 3000: Se on portin numero, jota luotu kehityspalvelin on määritetty kuuntelemaan.

Sukellaanpa syvemmälle localhost:3000:n käsitteeseen ymmärtämällä alla olevat kohdat yksitellen:

Kuinka käynnistää localhost:3000-palvelin koneellasi?

Localhost:3000-palvelimen käynnistämiseksi sinulla on oltava palvelu, joka toimii localhost:3000-portissa, kuten ReactJS , NodeJS , VueJS , AngularJS , jne. Jos työskentelet jonkin mainituista palveluista, sinun on kirjoitettava komento IDE-päätteeseen tai komentokehotteeseen käyttämäsi palvelun perusteella.

he ovat laulajia

Alla on lueteltu komennot eri palveluille:

  • Node.js : Jos koneellesi on asennettu node.js, jossa on Node Package Manager (npm). Voit käyttää työkaluja mm http-palvelin tai live-palvelin käynnistääksesi localhost:3000 kehityspalvelimen alla olevien komentojen avulla:
// 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>
  • ReactJS : ReactJS:n tapauksessa sinun ei tarvitse asentaa palvelinta ulkoisesti. Jos olet luomassa reagoivaa sovellusta käyttämällä luo-reagoi-sovellus se luo automaattisesti kehityspalvelimen. Sinun tarvitsee vain suorittaa alla olevat komennot käynnistääksesi palvelimen.
// Navigate to your project directory cd pathOfYourProject // Start the server npm start>
  • AngularJS : Angular-sovelluksen mukana tulee myös kehityspalvelin, sinun tarvitsee vain luoda kulmasovellus Angular CLI:n avulla ja suorittaa alla olevat komennot.
// 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>

Kuinka luoda kehityspalvelin sisään ReactJS ?

Noudata alla olevia ohjeita luodaksesi ja käynnistääksesi kehityspalvelimen ReactJS:ssä:



  • Vaihe 1: Luo reagointisovellus käyttämällä npm Create-React-app -komentoa määrittämällä projektin nimi sen jälkeen.
npm create-react-app projectName>
  • Vaihe 2: Siirry nykyiseen projektikansioosi.
cd pathToYourProject>
  • Vaihe 3: Luo tiedostoja sisällä src kansio ja suorita palvelin alla olevalla komennolla.
npm start>

Esimerkki: Alla olevaa koodia voidaan käyttää tiedostosi mallikoodina.

Javascript






// App.js file> import React, { useState } from>'react'>;> const App = ({ prop }) =>{> >const [isHidden, setIsHidden] = useState(>false>)> >function> btnClickHandler() {> >setIsHidden((prev) =>!edellinen);> >}> >return> (> >'center' }}>Tervetuloa techcodeview.com:hon { isHidden && A Computer Science Portal. } style={ { taustaväri: 'vihreä', väri: '#fff', täyte: '15px', kohdistin: 'osoitin', reunus: 'ei mitään, reunasäde: ' 10px' }}> Napsauta vaihtaaksesi lisää sivun sisältöä { isHidden && Tämä sisältö vaihdetaan dynaamisesti käyttämällä napsautustapahtumaa painikkeella. } ); }; Vie oletussovellus;>>

> 

Lähtö:

localhostGIF