Welcome to the Reptilicious project! This project is a web application built with Vue.js that brings to life the design concept of a new candy brand inspired by the jungle and its animals. The primary goal of this project is to practice implementing designs received from another group while improving our skills in Vue.js and its routing system.
We are a group of Front End Developer students at Medieinstitutet.
- Project Overview
- Tech Stack
- Features
- Setup
- Folder Structure
- Contributing
- License
Reptilicious is a fictional candy brand offering jungle-inspired flavors. The design was provided by another group as part of our school assignment, where the main objective is to translate the design into a functional web application using Vue.js with a focus on routing.
- Multi-page navigation with Vue Router
- Responsive design
- SCSS styling
- Dynamic product pages
- Home, Product, and About pages
To get started with the project, follow these steps:
- Node.js (v16 or later)
- npm or yarn
- Clone the repository:
git clone https://github.com/your-username/reptilicious.git
cd reptilicious
- Install dependencies:
npm install
- Start the development server:
npm run dev
- Open your browser and navigate to
http://localhost:3000
├── public # Static files
├── src # Source files
│ ├── assets # Images, icons, styles
│ ├── components # Vue components
│ ├── router # Vue Router configuration
│ ├── views # Page views
│ └── main.js # Main entry point
├── commitments_code.md # Design group commitments
├── commitments_design.md # Our code group commitments
├── LICENSE # License document
└── README.md # Project documentation
Mobile:
Tablet:
Desktop:
Mobile:
Tablet:
Desktop:
Contributions are welcome! If you'd like to contribute, please follow these steps:
- Fork the repository.
- Create a new branch (
feature/your-feature). - Commit your changes.
- Push to the branch.
- Open a pull request.
This project is licensed under the MIT License. See the LICENSE file for details.