Webpage for Recipies

Build a single webpage that is used to display popular recipes recommended by my friends

Authors

• Ahthesham Ali Syed

  Date: 12-27-2023

  Hours Spent: Approximately 8-10 hours

Setup & Running

Local Setup

Clone the Repository: Use the command below to clone the repository to your local machine: bash

  git clone [Repository-URL]

Replace [Repository-URL] with the URL of your Git repository.

Navigate to the Project Directory: Once cloned, navigate into the project directory using: bash

cd [Repository-Name]

Replace [Repository-Name] with the name of your project directory.

Install Dependencies: Install all necessary dependencies for the project. Given that you're using npm:

npm install

Run the Application: Start the application using the following command:

npm run dev

Your application should now be running on a specified local port, typically http://localhost:5173/ unless you've configured it differently.

Lessons Learned

During the course of this project, being relatively new to Vue, I encountered challenges in understanding some of its core concepts. Among them, the usage of ref from Vue's Composition API stood out. Essentially, ref is used to create reactive references to values. Whenever the value of this reference changes, Vue automatically updates the component to reflect these changes. At first, managing these reactive references seemed intricate. However, after diving deeper into Vue's documentation and related online resources, I began to grasp its importance in maintaining state and ensuring reactivity within components. This project was not only about overcoming specific technical challenges. It was also a holistic learning experience that expanded my understanding of modern frontend development, best practices, and the importance of persistence.