A modern, responsive web application for student housing communities, featuring real-time transport information, room reservations, message boards, and more. Built with Next.js, Firebase, and Tailwind CSS.
- Room Reservations: Book common spaces like Foyer, Party Room or Rooftop Terrace
- Transport Information: Real-time transport schedules and departures
- Lost & Found: System for tracking missing items & packages
- Message Board: Interactive board for student communications
- Weather: Local weather forecast integration
- Node.js 20.x or later
- npm or yarn
- Firebase account (for database functionality)
-
Clone the repository
git clone https://github.com/peaktwilight/witelli20.git cd witelli20 -
Install dependencies
npm install # or yarn install -
Set up environment variables
- Copy
.env.exampleto.env.local - Fill in your Firebase configuration details
- Copy
-
Start the development server
npm run dev # or yarn dev -
Open http://localhost:3000 with your browser to see the result
Create a .env.local file in the root directory with the following variables:
NEXT_PUBLIC_FIREBASE_API_KEY=your_firebase_api_key
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_project_id.firebaseapp.com
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_project_id.appspot.com
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
NEXT_PUBLIC_FIREBASE_APP_ID=your_app_id
This is an open source project, and contributions are welcome from anyone! Whether you want to fix bugs, add new features, improve documentation, or suggest ideas - your contributions are appreciated.
- Fork the repository
- Create your feature branch (
git checkout -b feature/YourFeature) - Make your changes
- Commit your changes (
git commit -m 'Add some feature') - Push to the branch (
git push origin feature/YourFeature) - Open a Pull Request
src/
├── app/ # Next.js app router pages
│ ├── api/ # API routes
│ ├── board/ # Message board
│ ├── reservations/ # Room reservation system
│ ├── stolen/ # Lost & found tracking
│ ├── transport/ # Transport information
│ └── weather/ # Weather forecast
├── components/ # Reusable React components
├── lib/ # Utility functions and APIs
│ ├── firebase.ts # Firebase configuration
│ ├── transportApi.ts # Transport API integration
│ └── weatherApi.ts # Weather API integration
└── types/ # TypeScript type definitions
TransportBoard: Displays transport information and schedulesStudentConnections: Manages student transport connectionsReservationCalendar: Calendar view of room reservationsMessageActions: Handles message-related actionsWeatherWidget: Displays local weather informationQuickLinks: Quick access to important resourcesFAQ: Frequently asked questions component
- Next.js - React framework
- Firebase - Backend and hosting
- Tailwind CSS - Styling
- TypeScript - Type safety
- Framer Motion - Animations
- Phosphor Icons - Icon system
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
The project includes automated tooling for managing releases:
- Make your changes and commit them
- Run the release script:
npm run release
- This will:
- Update the version in package.json
- Update the version in .env.local
- Create a git tag
- Push changes and tag to GitHub
- Trigger the GitHub Actions workflow to create a release
For more control over the release:
-
Update version:
npm version patch # or minor or major -
Push with tags:
git push --follow-tags
-
Or use GitHub CLI:
gh release create v0.1.x --title "Release title" --notes "Release notes"
View all releases on the GitHub Releases page.
The project can be deployed on various platforms:
-
Install Firebase CLI:
npm install -g firebase-tools
-
Login to Firebase:
firebase login
-
Initialize Firebase (if not already done):
firebase init
- Select Hosting and Firestore options
- Choose your Firebase project
- Use
buildas the public directory
-
Build the project:
npm run build
-
Deploy to Firebase:
firebase deploy
This project can be easily deployed on Vercel:
- Push your code to GitHub
- Connect your repository to Vercel
- Configure the environment variables
- Vercel will automatically deploy when you push to main
This project is licensed under the MIT License - see the LICENSE file for details.