You are browsing as a guest. Sign up (or log in) to start making projects!

OOTD generator

  • 9 Devlogs
  • 22 Total hours

I built this OOTD generator that uses AI to help me generate an outfit based on the weather and the my inspo style photos.

Open comments for this post

29m 51s logged

I found some mistakes in my README file primarily because I change my db storage from SQLite to Supabase after I wrote it, and I also forgot to add the deployment link. So everything should be all lined up and good to go now. First ship of this project!

0
0
30
Ship #1

I made this outfit generator webpage to help me pick out an outfit based on the weather. I realized that I often forget many of the pieces I have in my closet and struggle to find an outfit that I like. So this OOTD generator greatly helped me with this issue.
Features:

  • Each time the user click on the “generate outfit” button, the webpage will pull out a top and a bottom based on the current weather. The user can continue to click on the button until they find the outfit that they like.
  • I brought in the live weather feature using the WeatherAPI, and the user just need to set the location they are at.
  • The user can upload photos of their clothing pieces through an admin page, which will then be stored to a Supabase database. However, as this is my personal project, you will not have access to the admin page.
  • There’s also an inspiration section that displays inspo photos I grabbed from Pinterest and a notes section that allows user to take note of the clothing pieces that want.

Technical aspect:

Frontend

  • React
  • JavaScript
  • HTML
  • CSS
  • Vite
  • React Router

Backend

  • Node.js
  • Express.js
  • Axios
  • Multer
  • CORS
  • dotenv
  • 8 devlogs
  • 21h
  • 9.40x multiplier
  • 199 Stardust
Try project → See source code →
Open comments for this post

3h 23m 2s logged

After two days of debugging and trying to deploy the project. The project is finally live on Vercel! I deployed the backend on Render and the front end on Vercel. I also changed my database storage from SQLite to Supabase database as Supabase is a cloud storage site that allow dynamic storage and I also don’t need to worry about uploading a ton of my personal clothing images to Github.

0
0
11
Open comments for this post

2h 38m 45s logged

I’m wrapping up the project! I wrote the README.md file, cleaned up the code, added comments for users to better understand the code, and tested to make sure everything is working. Then, I pushed everything to Github. I will be working on the deploying and hosting of the project now. I’m planning to host it on Vercel and Render, but will have to carefully think about the privacy aspect of the database.

0
0
16
Open comments for this post

2h 34m 9s logged

I added another notes section on the webpage helping users to keep track of the clothing items they need/want to buy. I also expanded my clothing db and cleaned up my code a bit. Now this project should be near complete! So happy that it is coming along, let me know if you have any suggestions.

0
0
16
Open comments for this post

2h 55m 34s logged

I improved the front-end design of the webpage. I added an inspiration corner section where I put some inspo outfit photos I got from Pinterest. I also improved the weather display. Let me know if you have any suggestions about what else to add to this webpage to make it more aesthetic.

0
0
17
Open comments for this post

2h 55m 16s logged

After lots of debugging, I finally connected my front-end and backend, as well as the weather API. Right now, I use an admin page to upload my clothing photos to the SQLite database. Along with the upload, I will also fill out the type (top/bottom) and the temperature range of that piece. When I click on the generate outfit button, it will randomly pick outa top and a bottom based on the temperature received from the weather API.

0
0
5
Open comments for this post

2h 33m 6s logged

I built a backend page that allows the admin (me) to upload my clothing images, which will be stored in a database. Later the AI will pick out the outfit and its corresponding images from this database. I chose to use SQLite to hold these images.

0
0
11
Open comments for this post

2h 41m 10s logged

I built the basic structure of the webpage, trying to make it look similar to my prototype. I implemented the WeatherAPI to make the weather block display the actual weather based on my location. Now, I’m working on implementing the photo uploads feature for this generator. I will use multer to handle image uploads and sqlite3 to store all the images I uploaded.

0
0
11
Open comments for this post

1h 29m 3s logged

I’m planning to code this outfit generator dashboard that can generate a top and bottom for me based on the weather of the day. I will import photos of my own clothings and train an AI using inspo Pinterest photos to help the AI learn my style. As for thee weather, I’m planning to use an API. This is a photo of a prototype I made using Figma and I’ve just installed all the packages I need.

0
0
8

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…