A real-time bus schedule application for the GMV D.A.S.H. F Route.
This is a C# .NET Core 8 Web API with a React.js frontend project, allowing a user to quickly view the next scheduled bus arrival at a selected stop.
- RESTful API endpoints for Bus Stops and Schedules
- React.js SPA minimal frontend
- API versioning
- CORS enabled for frontend-backend communication
- Unit, integration, and E2E tests
- Database initialization and seeding
- Dependency injection
- OpenAPI Swagger endpoint documentation
- Backend: C#, .NET Core v8.0.20, Dapper, AutoMapper
- Frontend: React.js, JavaScript, Bootstrap
- Database: SQLite
- Testing: MSTest, Moq
- .NET 8.0.20 SDK
- Node.js & npm
- Git command line or GUI application of your choice
- Development IDE (Rider, Visual Studio, or VS Code)
- Clone the gmv GitHub repository to a local directory:
git clone https://github.com/chighet/gmv.git- Checkout the main branch.
git checkout main-
Open the BusStops.sln solution file located at ..\gmv\BusStops\BusStops.sln with the IDE of your choice.
-
Launch the back-end server application. For simplicity, you'll probably want to use the BusStops.http configuration.
-
Once running, a web browser should be launched displaying a Swagger interface.
- NOTE: On first launch, it may take a moment for the Swagger page to load.
-
In the terminal window, navigate to the Frontend directory and install NPM. Depending on your system this process may take some time to complete. Once the installation completes launch the React SPA.
- NOTE: The path separator character may vary based on operating system.
- MacOS and Linux
cd ../gmv/BusStops/src/Frontend
npm install
npm start- Windows
cd ..\gmv\BusStops\src\Frontend
npm install
npm start- Once the React SPA project is running a web browser will launch presenting you with the user web interface.
The Swagger interface can be used to test the Stop and Schedule endpoints. The Url can be found at http://localhost:5151/swagger/index.html
The front end UI can be found at http://localhost:3000/home
- Select a bus stop from the dropdown.
- The frontend queries the backend API.
- Next bus arrival time for that stop is displayed.