diff --git a/README.md b/README.md index 5a77ecd..4b29bf6 100644 --- a/README.md +++ b/README.md @@ -1,72 +1,93 @@ -# 🚆 Train Departure Times App +# 🚆 Where Is My Train ![Work in Progress](https://img.shields.io/badge/Status-Work%20in%20Progress-red) +[![Next.js](https://img.shields.io/badge/Next.js-14.0-black)](https://nextjs.org/) +[![TypeScript](https://img.shields.io/badge/TypeScript-5.0-blue)](https://www.typescriptlang.org/) +[![PWA](https://img.shields.io/badge/PWA-Ready-success)](https://web.dev/progressive-web-apps/) -## Overview +A modern, responsive Progressive Web App (PWA) that provides real-time train departure information. Built with Next.js and TypeScript, deployed on Vercel. -This application provides train departure times from a chosen station. It's a work in progress and is built using Next.js with TypeScript. The data is fetched from an external source using an API key. +## ✨ Features -## Stack +- 🚉 Real-time train departure information +- 📱 PWA support for mobile installation +- 📍 Station search functionality -The app is built using the following technologies: +## 🛠️ Tech Stack -- **Next.js**: A React framework for building web applications. -- **TypeScript**: A statically-typed superset of JavaScript. -- **Vercel**: A cloud platform for deploying web projects. +- **Framework:** [Next.js 14](https://nextjs.org/) +- **Language:** [TypeScript](https://www.typescriptlang.org/) +- **Styling:** SASS/SCSS +- **Analytics:** Vercel Analytics +- **Deployment:** [Vercel](https://vercel.com) +- **PWA Support:** next-pwa -## Setup +## 🚀 Getting Started -To get started with this project, follow these steps: +### Prerequisites -To get started with this project, follow these steps: +- Node.js 18+ +- npm/yarn/pnpm -1. Clone this repository: +### Installation +1. Clone the repository ```bash - $ git clone - -2. Navigate into the project directory: - ```bash - $ cd where-is-my-train + git clone https://github.com/julianaijal/where-is-my-train.git + cd where-is-my-train ``` -3. Install the requirements + +2. Install dependencies ```bash - $ npm install + npm install + # or + yarn install + # or + pnpm install ``` -4. Make a copy of the example environment variables file - On Linux systems: +3. Set up environment variables + ```bash + cp .env.example .env + ``` + Add your API key to the `.env` file: + ``` + API_KEY=your_api_key_here + ``` +4. Start the development server ```bash - $ cp .env.example .env + npm run dev + # or + yarn dev + # or + pnpm dev ``` - On Windows: +5. Open [http://localhost:3000](http://localhost:3000) in your browser - ```powershell - $ copy .env.example .env - ``` +## 🌐 Live Demo -5. Add API Key +Visit [where-is-my-train.vercel.app](https://where-is-my-train.vercel.app) to see the live application. -6. Run the development server: -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -# or -bun dev -``` +## 📱 PWA Installation -6. Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. +This app can be installed as a Progressive Web App: -## Screenshots +1. Visit the website in Chrome/Edge/Safari +2. Look for the "Install" or "Add to Home Screen" option +3. Follow the prompts to install the app +## 🤝 Contributing -![Work in Progress](https://img.shields.io/badge/Status-Work%20in%20Progress-red) +Contributions are welcome! Please feel free to submit a Pull Request. + +1. Fork the repository +2. Create your feature branch (`git checkout -b feature/AmazingFeature`) +3. Commit your changes (`git commit -m 'Add some AmazingFeature'`) +4. Push to the branch (`git push origin feature/AmazingFeature`) +5. Open a Pull Request -## Demo +## 📄 License -You can access a live demo of this app at [where-is-my-train.vercel.app](https://where-is-my-train.vercel.app). \ No newline at end of file +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.