[Mã code 57723]

Website đơn giản xem thời tiết ở các thành phố dùng API OpenWeatherMap - Node.js - React.js

  (1 Đánh giá)
  0       4    

Backend: Node.js + Express + Axios + dotenv + CORS Frontend: React.js + CSS API: OpenWeatherMap

Danh mục
Thể loại
Ngày đăng
10-7-2025
Loại file
Full code
File download
 # [#]
CAM KẾT TỪ NGƯỜI BÁN
Chức năng đầy đủ và giống demo 100%

(Hạng vàng)
Xem trang

Source code
3

Đánh giá (3)
5/5

Ngày tham gia
20/1/2025

Các chức năng chính của dự án này gồm:
1. Tìm kiếm thành phố:
Nhập tên thành phố để lấy thông tin vị trí (tọa độ).
 
2. Xem thời tiết hiện tại:
Hiển thị nhiệt độ, trạng thái thời tiết, độ ẩm, gió... của thành phố đã chọn.
 
3. Dự báo thời tiết 5 ngày:
Xem dự báo thời tiết chi tiết cho 5 ngày tiếp theo.
 
4. Xem chất lượng không khí:
Hiển thị chỉ số chất lượng không khí (AQI) tại vị trí đã chọn.
 
5. Giao diện trực quan, dễ sử dụng:
Có thanh tìm kiếm, các tab hoặc card hiển thị thông tin rõ ràng.


XEM THÊM ==> Hướng dẫn cài đặt chi tiết

HÌNH ẢNH DEMO


thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website

thời tiết,React,Nodejs,API,Weather,Website


HƯỚNG DẪN CÀI ĐẶT
HƯỚNG DẪN CHẠY DỰ ÁN WEBSITE DỰ BÁO THỜI TIẾT TRÊN MÁY KHÁC
 
1. Cài đặt Node.js
- Tải và cài Node.js tại: https://nodejs.org/
- Kiểm tra cài đặt thành công bằng lệnh:
  node -v
  npm -v
 
2. Giải nén file .rar (pass giải nén: 123) sau đó mở dự án bằng VS code (Hoặc IDE gì đó miễn là chạy được)
 
3. Cài đặt thư viện cho backend
- Mở terminal/cmd, di chuyển vào thư mục backend:
  cd backend
- Cài đặt các thư viện:
  npm install
 
4. Cài đặt thư viện cho frontend
- Di chuyển vào thư mục frontend:
  cd frontend
- Cài đặt các thư viện:
  npm install
 
5. Cấu hình file .env (Lấy Key trong video DEMO)
- Nếu bạn có API key, hãy copy key này và thay vào file .env và server.js trong thư mục backend.
 
6. Chạy backend
- Trong thư mục backend, chạy lệnh:
  node server.js
- Backend sẽ chạy ở cổng (port) mặc định, ví dụ: http://localhost:5000
 
7. Chạy frontend
- Trong thư mục frontend, chạy lệnh:
  npm run start
- Frontend sẽ chạy ở cổng (port) mặc định, ví dụ: http://localhost:3000
 
8. Mở trình duyệt và truy cập
- Truy cập địa chỉ: http://localhost:3000 để sử dụng website.
 
Lưu ý:
- Luôn chạy npm install ở cả hai thư mục backend và frontend sau khi copy dự án sang máy mới.
- Nếu gặp lỗi, hãy kiểm tra lại phiên bản Node.js, npm và các file cấu hình.
 
Chúc bạn chạy dự án thành công! Nếu gặp vấn đề, hãy gửi lỗi cho CHATGPT để được hỗ trợ.
 



Nguồn: Topcode.vn

BÌNH LUẬN (0)


ĐÁNH GIÁ (1)

ĐIỂM TRUNG BÌNH

5
1 Đánh giá
Code rất tốt (1)
Code tốt (0)
Code rất hay (0)
Code hay (0)
Bình thường (0)
Thành viên
Nội dung đánh giá
15:46 - 10/7/2025
Code rất tốt
Code rất tốt và phù hợp để phát triển
HỖ TRỢ TRỰC TUYẾN