View the completed app on Heroku here.
Style My Travel a full-stack React app that's a one stop shop for jet-setters. You don't need to open multiple tabs to book your vacation, add it into your calendar, search the weather in that city, and decide what to wear and pack: Style My Travel does all of this for you!
Simply create a travel profile and input your upcoming travels to see all of your trips in one place on our travel calendar. Then, click your trip on the calendar for your personalized fashion itinerary, which includes fashion-spired outfits personally tailored to your specific trip, the weather in that city, and more. Don't forget to ❤ your fave outfits for inspiration, and create your packing list right there from the itinerary!
Technologies Used:
- React
- React-Big-Calendar
- Tumblr API
- OpenWeatherMap API
- Animate CSS
- Elemental-UI
- Semantic-UI
- Material-UI
- BcryptJS
- JsonWebToken
- Babel
- MongoDB
- Mongoose
- Axios
- Express
- Node.js
- Javascript
- Bootstrap
- Passport
- HTML
- CSS
Screenshots:
INSTRUCTIONS:
-
ON THE MAIN PAGE:
- Learn about the app
- Sign up to create an account / Login to your account
-
ON THE TRAVEL FORM:
- The app will take you to a travel form, where you will input your travel plans, including your location, timeline, hotel, and flight
-
ON THE CALENDAR:
-
After you've inputted your travel plans, your trip is posted to the travel calendar, where you can also view any other travel plans previously inputted
-
Simply click any date and you'll be taken to your customized itinerary for that trip
-
-
ON THE CUSTOMIZED ITINERARY:
-
On your customized travel itinerary, you'll see your travel info, the weather for your trip, plus fashion photos from the Tumblr API specific to the city you're travelling to that are ideal for the weather in your city.
-
You can ❤ any photo to add it to your favorites to access it at any time from your itinerary (or delete it from your Favorites if you change your mind).
-
There is the ability to add another trip or delete this trip
-
You can also create a packing list
-
Mock Photos for Planning Phase:
- Choose your already planned travel
- What you should wear if you are headed to Paris — pair with Weather API
- We'll book the trip for you
- Add additional experiences like airbnb, trip advisor, food options, etc
- In-app purchases, clothing boxes, and partnership opps
- Bookings and purchases all within the app so that the app serves as a one stop shop: no need to open a million tabs to book your travel, check the weather, and plan/purchase your outfits
- Leslie: Lead Backend Developer– Full Stack Developer
- Andrea: User Authentication, Back-end, Front-end UI
- Laura: Lead Front-end
- Mayra: Javascript, OpenWeatherMap API, Slide Deck