Localhost:3000 to domyślny port używany przez serwery internetowe. To jest lokalny serwer programistyczny to trwa Port 3000 . Jest bardzo często używany przez doświadczonych, początkujących i średniozaawansowanych programistów podczas pracy nad aplikacją internetową. Programiści używają localhost:3000, aby zobaczyć podgląd opracowanej aplikacji i przetestować ją zgodnie z wymaganiami dotyczącymi responsywności i innych parametrów przed wdrożeniem jej do produkcji.
Pozwól nam zrozumieć localhost:3000, dzieląc go na części:
- Lokalny Gospodarz: Odnosi się do nazwy hosta lub bieżącego urządzenia, którego używasz do celów programistycznych.
- 3000: Jest to numer portu, na którym skonfigurowany jest utworzony serwer programistyczny do nasłuchiwania.
Zanurzmy się głębiej w koncepcję localhost:3000, rozumiejąc kolejno poniższe punkty:
Jak uruchomić serwer localhost:3000 na swoim komputerze?
Aby uruchomić serwer localhost:3000, musisz mieć usługę działającą na porcie localhost:3000, np. ReagujJS , WęzełJS , VueJS , AngularJS itp. Jeśli pracujesz z którąkolwiek z wymienionych usług, musisz wpisać polecenie w terminalu swojego IDE lub w wierszu poleceń w zależności od używanej usługi.
słuchaj portu
Polecenia dla różnych usług są wymienione poniżej:
- Node.js : Jeśli masz zainstalowany node.js na swoim komputerze z Menedżer pakietów węzłów (npm). Możesz użyć narzędzi takich jak serwer http Lub serwer na żywo aby uruchomić serwer programistyczny localhost:3000 za pomocą poniższych poleceń:
// 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>
- ReagujJS : W przypadku ReactJS nie ma potrzeby instalowania serwera z zewnątrz. Jeśli tworzysz aplikację reagującą przy użyciu utwórz-reaguj-aplikację automatycznie tworzy serwer deweloperski. Aby uruchomić serwer, wystarczy uruchomić poniższe polecenia.
// Navigate to your project directory cd pathOfYourProject // Start the server npm start>
- AngularJS : Aplikacja Angular jest również dostarczana z serwerem programistycznym, wystarczy utworzyć aplikację Angular za pomocą Angular CLI i uruchomić poniższe polecenia.
// 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 stworzyć serwer deweloperski w ReagujJS ?
Wykonaj poniższe kroki, aby utworzyć i uruchomić serwer programistyczny w ReactJS:
- Krok 1: Utwórz aplikację reagującą za pomocą npm utwórz-reaguj-aplikację polecenie, podając po nim nazwę projektu.
npm create-react-app projectName>
- Krok 2: Przejdź do bieżącego folderu projektu.
cd pathToYourProject>
- Krok 3: Utwórz pliki wewnątrz źródło folder i uruchom serwer za pomocą poniższego polecenia.
npm start>
Przykład: Poniższy kod może zostać użyty jako kod szablonu dla Twojego pliku.
JavaScript
// App.js file> import React, { useState } from>'react'>;> const App = ({ prop }) =>{> >const [isHidden, setIsHidden] = useState(>false>)> >function> btnClickHandler() {> >setIsHidden((prev) =>!poprzednia);> >}> >return> (> >'center' }}>Witamy w techcodeview.com {isHidden && Portal informatyczny. } style={ { kolor tła: 'zielony', kolor: '#fff', dopełnienie: '15px', kursor: 'wskaźnik', obramowanie: 'brak', obramowanieRadius: ' 10px' }}> Kliknij, aby przełączyć więcej zawartości strony { isHidden && Ta zawartość jest przełączana dynamicznie za pomocą zdarzenia kliknięcia z przyciskiem. } ); }; eksportuj domyślną aplikację;> |
>
>
Wyjście:
