OutFitMe

"Your Personal Digital Stylist & Weather-Ready Wardrobe!"

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Prerequisites
   • Installation
3. Usage
4. Contributing
5. License
6. Contact

About The Project

OutFitMe is a user-friendly application that enables users to upload pictures of their clothing and tag them by type and optimal weather conditions (temperature range, rain suitability, etc.). With a simple click, users can generate outfits tailored to the day's weather forecast.

The outfit randomizer display includes a live weather update for the user's location. Additionally, the sidebar features icons that lead to galleries of all uploaded items categorized by type.

(back to top)

Built With

(back to top)

Getting Started

In order to get OutFitMe to work, there are two external services that need to be connected to the app. You will need to gather their information and store it in a .env file:

Prerequisites

• npm

  npm install npm@latest -g

• Obtain API key for:

  • OpenWeatherMap API :

    • Go to https://openweathermap.org/ and get a free membership.
    • Once logged in, locate your username drop down in the navbar, and navigate to "My API Keys".
    • In "My API Keys" make sure you have an Active key, and save its Key and Name to add them to the .env file.

  • Cloudinary API :

    • Go to https://cloudinary.com/ and get a free membership.
    • Once logged in, locate the "Assets" icon at the top of the sidebar and click on it.
    • Here you can create a new folder to upload pictures to, name it however you want and save the Folder name to add it to the .env file.
    • Now locate the settings icon at the bottom of the sidebar, and click on it.
    • In "Settings", another sidebar will become visible. Click on "API Keys" and save your Cloud name to add it to the .env file.
    • Make sure you have an Active key, and save its API Key and API Secret to add them to the .env file.
    • In "Settings", click on "Upload Presets" and add a new preset with Signing mode Unsigned. Leave all other options as is and save it, then save its Name to add it to the .env file.

Once you have collected all necessary information from both services, create a .env file in the client folder, and add the information like this:

VITE_CLOUD_NAME=placeholder
VITE_UPLOAD_PRESET=placeholder
VITE_CLOUDINARY_FOLDER=placeholder
VITE_CLOUDINARY_API_KEY=placeholder
VITE_CLOUDINARY_API_SECRET=placeholder

VITE_OPENWEATHER_API_NAME=placeholder
VITE_OPENWEATHER_API_KEY=placeholder

Installation

1. Clone the repo

   git clone github.com/Sind96/OutFitMe

2. Create your own .env file and insert the Api Keys as mentioned in (Prerequisites)

3. Install NPM packages in both client and server folders

   npm install

4. Start the app in both the client and server folders

   client: npm run dev
   server: nodemon server.js

(back to top)

License

Distributed under the MIT License. See license.txt for more information.

(back to top)

Contact

Charbel Rouhana - Github - LinkedIn - charbelmrouhana@gmail.com

Sindhu Yogu - Github - LinkedIn - sindy96jan@gmail.com

Sulo Siguur- Github - LinkedIn - sulo.siigur@gmail.com