랩
이 절차는 New Relic 브라우저로 웹 앱의 문제를 해결하는 방법을 알려주는 랩의 일부입니다. 아직 확인하지 않았다면 실습 소개를확인하세요.
실습을 제대로 진행하려면 먼저 React 애플리케이션을 가동해야 합니다. 여기에서 당신은:
- React 애플리케이션 가동
- 간단한 로드 생성기를 사용하여 앱에 트래픽 보내기
터미널 창을 열고 랩 리포지토리를 복제합니다.
$git clone https://github.com/newrelic-experimental/relicstaurants.git
애플리케이션의 루트 디렉터리로 이동하여 lab 디렉터리로 전환합니다.
$cd relicstaurants$git switch browser-pro-lab-material
다음으로 종속성을 설치하고 애플리케이션을 실행합니다.
$npm install$npm run build$npm run newstart
이렇게 하면 브라우저에서 Relicstaurants 애플리케이션이 열립니다.
배달 주소를 입력하고 레스토랑을 검색하여 시작하세요.
여기에서 음식을 주문할 수 있는 레스토랑 목록을 볼 수 있습니다.
식당을 선택하세요.
항목을 한두 개 선택하고 카트를 클릭합니다.
PAY[지불을]클릭합니다.
아래 가짜 카드 정보를 입력하고 Finish payment[결제 완료를] 클릭하여 주문하십시오.
주문이 완료되었습니다.
다음으로 시뮬레이터를 사용하여 애플리케이션에 더 많은 트래픽을 생성합니다.
다른 터미널 창에서 애플리케이션의 루트 디렉터리로 이동하고 부하 생성기를 실행합니다.
$# Navigate to the root directiory of your simulator$cd relicstaurants/simulator$# Switch to lab branch$git switch browser-pro-lab-material$# Install the simulator's dependencies$pip3 install -r requirements.txt$# Run the simulator$python3 simulator.py====== WebDriver manager ======Current google-chrome version is 99.0.4844Get LATEST chromedriver version for 99.0.4844 google-chrome
중요
이 부하 생성기는 컴퓨터에 Google Chrome이 설치되어 있다고 가정합니다. 다른 브라우저를 사용하는 경우 이 단계를 건너뛰고 수동으로 트래픽을 생성하거나 Google 크롬을 설치하세요.
이제 응용 프로그램을 실행하는 방법을 알았으니 계측할 차례입니다. 애플리케이션과 시뮬레이터를 실행 중인 터미널 창에서 <CTRL-C>
를 눌러 종료합니다. 앱이 종료되면 코드를 업데이트하여 모니터링 도구를 도입할 수 있습니다.
랩
이 절차는 New Relic 브라우저로 웹 앱의 문제를 해결하는 방법을 알려주는 랩의 일부입니다. 이제 환경을 설정했으므로 브라우저 에이전트로 애플리케이션을 계측합니다.