Localhost 3000
Localhost:3000 je výchozí port používaný webovými servery. Je to a místní vývojový server že běží dál přístav 3000 . Velmi běžně jej používají zkušení i začátečníci a středně pokročilí vývojáři při práci na webové aplikaci. Vývojáři pomocí localhost:3000 vidí náhled vyvíjené aplikace a otestují ji podle požadavků na odezvu a dalších parametrů před nasazením do produkce.
Pojďme pochopit localhost:3000 tím, že to rozebereme:
- localhost: Odkazuje na název hostitele nebo aktuální zařízení, které používáte pro účely vývoje.
- 3000: Je to číslo portu, na kterém je vytvořený vývojový server nakonfigurován k naslouchání.
Pojďme se ponořit hlouběji do konceptu localhost:3000 pochopením níže uvedených bodů jeden po druhém:
Jak spustit server localhost:3000 na vašem počítači?
Chcete-li spustit server localhost:3000, musíte mít službu, která funguje na portu localhost:3000 jako ReactJS , NodeJS , VueJS , AngularJS , atd. Pokud pracujete s některou z uvedených služeb, musíte zadat příkaz do terminálu vašeho IDE nebo příkazového řádku na základě služby, kterou používáte.
Příkazy pro různé služby jsou uvedeny níže:
- Node.js : Pokud máte na svém počítači nainstalovaný node.js s Správce balíčků uzlů (npm). Můžete použít nástroje jako http-server nebo živý server ke spuštění vývojového serveru localhost:3000 pomocí níže uvedených příkazů:
// 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 : V případě ReactJS nemusíte server instalovat externě. Pokud vytváříte aplikaci pro reakce pomocí create-react-app automaticky vytvoří vývojový server. Ke spuštění serveru stačí spustit níže uvedené příkazy.
// Navigate to your project directory cd pathOfYourProject // Start the server npm start
- AngularJS : Aplikace Angular také přichází s vývojovým serverem, stačí vytvořit aplikaci Angular pomocí Angular CLI a spustit níže uvedené příkazy.
// 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
Jak vytvořit vývojový server v ReactJS ?
Chcete-li vytvořit a spustit vývojový server v ReactJS, postupujte podle následujících kroků:
- Krok 1: Vytvořte aplikaci pro reakce pomocí npm create-react-app zadáním názvu projektu za ním.
npm create-react-app projectName
- Krok 2: Přejděte do aktuální složky projektu.
cd pathToYourProject
- Krok 3: Vytvářejte soubory uvnitř src složku a spusťte server pomocí níže uvedeného příkazu.
npm start
Příklad: Níže uvedený kód lze použít jako kód šablony pro váš soubor.
Javascript
// App.js file> import React, { useState } from> 'react'> ;> const App = ({ prop }) =>{> > const [isHidden, setIsHidden] = useState(> false> )> > function> btnClickHandler() {> > setIsHidden((prev) =>!prev);> > }> > return> (> > 'center' }}>Vítejte na techcodeview.com { isHidden && A Computer Science Portal. } style={ { backgroundColor: 'zelená', barva: '#fff', výplň: '15px', kurzor: 'ukazatel', okraj: 'none', borderRadius: ' 10px' }}> Kliknutím přepnete další obsah stránky { isHidden && Tento obsah se přepíná dynamicky pomocí události kliknutí s tlačítkem. }); }; exportovat výchozí aplikaci;> |
Výstup:
