Skip to content

my vision

Seiraxe edited this page Feb 1, 2025 · 14 revisions

"My Vision" is designed to help users set, track, and visualize their yearly goals. The website features a structured goal-management system, allowing users to organize their aspirations by month. Additionally, a vision board tool enables users to create visual representations of their goals using images

and here is the flowchart Setup

Follow these steps to install, configure, and run the project locally.

Prerequisites

Before running the project, make sure you have the following installed:

Node.js (LTS version recommended) MongoDB (or use MongoDB Atlas for cloud storage) Git (for cloning the repository) A code editor like VS Code Installation Steps

  1. Clone the Repository Open a terminal and run:

git clone https://github.com/your-username/your-repository.git cd your-repository 2. Install Dependencies Run the following command inside the project folder:

npm install Configuration

  1. Set Up Environment Variables Create a .env file in the root directory. Add the following variables: MONGODB_URI=your-mongodb-connection-string PORT=3000 Replace your-mongodb-connection-string with your actual database connection string. Running the Project

  2. Start the Application Run the following command:

npm start Or, if you're using nodemon (for automatic server restarts):

npm run dev 5. Access the Website Once the server is running, open your browser and visit:

http://localhost:3000 Additional Notes

If using MongoDB locally, make sure your database server is running before starting the project: mongod If using MongoDB Atlas, ensure your IP is whitelisted in the Network Access settings. If you face any issues, check the logs in the terminal for error messages

Technologies used Node.js, Express, MongoDB, EJS, HTML, CSS).

GOALS:

Goal Organization: Users can structure their yearly goals by month for better clarity and focus.

Visualization: The vision board feature helps users create a visual representation of their aspirations, making goals more tangible and motivating.

Tracking Progress: The website enables users to monitor their goals throughout the year, keeping them accountable and motivated.

Reflection and Adjustment: Users can review past progress, make adjustments, and stay on track with their objectives.

User Engagement: Encouraging consistent interaction with their goals fosters a sense of achievement and motivation.

SOME SCREENSHOTS FOR THE WEB

this is the home page

and here when the user click on "my goals"

https://github.com/manarmdf/group-website/blob/main/WhatsApp%20Image%202025-02-01%20at%208.40.57%20PM.jpeg

and here when the user click on "my vision borad"

https://github.com/manarmdf/group-website/blob/main/WhatsApp%20Image%202025-02-01%20at%208.40.56%20PM.jpeg

Future Work

  • User authentication (login/signup)

  • Dark mode or Ul improvements

    Resources

  • MongoDB - MongoDB Documentation

  • Bootstrap - Bootstrap Documentation

  • EJS (Embedded JavaScript) - EJS

TEAM MEMBERS: Renad alateeq ,Sara Abduallh Moubrad,Manar mansour almudayfir

Clone this wiki locally