A fan-made promotional website for the third expansion of the MMORPG Guild Wars 2, built with Next.js and React. The project was created during a project week and demonstrates the use of REST APIs, dynamic routing, SASS styling, and server-side rendering.
- Home Page – Game introduction with an embedded YouTube trailer and call-to-action
- Character Viewer – Card-based overview of custom characters with dynamic detail pages (
/character/[name]) - Daily Achievements – Live data from the official GW2 REST API with category and difficulty filters
- Explore Cantha – Image gallery of the new in-game world using
react-image-gallery - Random Main Cast – Sidebar displays a randomly chosen NPC from the main cast on every page load
| Technology | Usage |
|---|---|
| Next.js 12 | Framework, routing, SSG/SSR |
| React 18 | UI components |
| SASS | Styling (modular SCSS) |
| react-image-gallery | Image gallery on the Cantha page |
| GW2 API v2 | Real-time data for daily achievements |
# Clone the repository
git clone https://github.com/Unitycorn/Projektwoche.git
cd Projektwoche
# Install dependencies
npm install
# Start the development server
npm run devThe app will be running at http://localhost:3000.
# Production build
npm run build
npm run startProjektwoche/
├── components/ # Reusable UI components
│ ├── Layout.jsx # Page layout with header, footer, background video
│ ├── Navigation.jsx # Main navigation
│ ├── CharacterViewer.jsx
│ ├── MainCastViewer.jsx
│ ├── AchievementList.jsx
│ └── YoutubeEmbed.jsx
├── pages/ # Next.js pages & routing
│ ├── index.jsx # Home page
│ ├── characters.jsx # Character overview
│ ├── character/
│ │ └── [name].jsx # Dynamic character detail page
│ ├── achievements.jsx
│ └── cantha.jsx
├── library/ # Data files (characters, NPCs)
├── hooks/ # Custom React hooks
├── sass/ # SCSS styles (modular)
└── public/ # Static assets (images, fonts)
- The Daily Achievements page uses the legacy GW2 API endpoint (
/achievements/daily), which ArenaNet replaced with a new system in late 2023. The page currently displays a corresponding notice. Updating to the new API is still pending. - The navigation is not yet optimized for mobile devices (burger menu missing).
This is an unofficial fan project. All game content, logos, and trademarks are the property of ArenaNet, LLC and NCSoft. This project is not intended for commercial use.
This project was created for educational purposes and is not intended for commercial use.