Project Info

Winner

Hack for Fun

explr.ai

Inspiration

Planning vacations can be hard. Traveling is a very fun experience but often comes with a lot of stress of curating the perfect itinerary with all the best sights to see, foods to eat, and shows to watch. You don't want to miss anything special, but you also want to make sure the trip is still up your alley in terms of your own interests - a balance that can be hard to find.

What it does

explr.ai simplifies itinerary planning with just a few swipes. After selecting your destination, the duration of your visit, and a rough budget, explr.ai presents you with a curated list of up to 30 restaurants, attractions, and activities that could become part of your trip. With an easy-to-use swiping interface, you choose what sounds interesting or not to you, and after a minimum of 8 swipes, let explr.ai's power convert your opinions into a full itinerary of activities for your entire visit.

How we built it

We built this app using React Typescript for the frontend and Convex for the backend. The app takes in user input from the homepage regarding the location, price point, and time frame. We pass the location and price range into the Google API to retrieve the highest-rated attractions and restaurants in the area. Those options are presented to the user on the frontend with React and CSS animations that allow you to swipe each card in a Tinder-style manner. Taking consideration of the user's swipes and initial preferences, we query the Google API once again to get additional similar locations that the user may like and pass this data into an LLM (using Together.ai's Llama2 model) to generate a custom itinerary for the user. For each location outputted, we string together images from the Google API to create a slideshow of what your trip would look like and an animated timeline with descriptions of the location.

Challenges we ran into

Front-end and design require a LOT of skill. It took us quite a while to come up with our project, and we originally were planning on a mobile app, but it's also quite difficult to learn completely new languages such as swift along with new technologies all in a couple of days. Once we started on explr.ai's backend, we were also having trouble passing in the appropriate information to the LLM to get back proper data that we could inject back into our web app.

Accomplishments we're proud of

We're proud at the overall functionality and our ability to get something working by the end of the hacking period :') More specifically, we're proud of some of our frontend, including the card swiping and timeline animations as well as the ability to parse data from various APIs and put it together with lots of user input.

What we learned

We learned a ton about full-stack development overall, whether that be the importance of Figma and UX design work, or how to best split up a project when every part is moving at the same time. We also learned how to use Convex and Together.ai productively!

What's next

We would love to see explr.ai become smarter and support more features. explr.ai, in the future, could get information from hotels, attractions, and restaurants to be able to check availability and book reservations straight from the web app. Once you're on your trip, you should also be able to check in to various locations and provide feedback on each component. explr.ai could have a social media component of sharing your itineraries, plans, and feedback with friends and help each other better plan trips.

React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

@vitejs/plugin-react uses Babel for Fast Refresh
@vitejs/plugin-react-swc uses SWC for Fast Refresh

Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:

Configure the top-level parserOptions property like this:

   parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module',
    project: ['./tsconfig.json', './tsconfig.node.json'],
    tsconfigRootDir: __dirname,
   },

Replace plugin:@typescript-eslint/recommended to plugin:@typescript-eslint/recommended-type-checked or plugin:@typescript-eslint/strict-type-checked
Optionally add plugin:@typescript-eslint/stylistic-type-checked
Install eslint-plugin-react and add plugin:react/recommended & plugin:react/jsx-runtime to the extends list

Analysis

Compare with all teams

View

Metric

Figures cover GitHub contributors during the hackathon window. A co-authored commit counts in full for each author, so per-member totals add up to more than the whole-team figures.

Technology

Found in codeClaimed only

CSSIn code
HTMLIn code
JavaScriptIn code
PythonIn code
ReactIn code
TypeScriptIn code

6 of 6 appear in the indexed code.

AI coding agents

No AI coding agent signals were found in this repository.

Detected from committed agent config files and commit authorship. Absence of a signal is not proof an agent was unused.

Codebase size

Source size

88 KB

Source files

Counts recognized source files only; vendored directories, binaries and lockfiles are excluded, so this is smaller than the repository on disk.

Feature verification

6 Verified3 Code-supported2 Claimed only

Animated timeline with descriptionsVerified
An animated timeline with descriptions of the location
Claimed on Devposthigh confidence
- src/Itinerary/index.tsx:207 — VerticalTimeline/VerticalTimelineElement from react-vertical-timeline-component renders each itinerary event with day, time, name, description, and image
Image slideshow of trip locationsVerified
String together images from the Google API to create a slideshow of what your trip would look like
Claimed on Devposthigh confidence
- src/Itinerary/Slideshow.tsx:85 — Slideshow component renders a SlideCard per event with a CSS opacity keyframe animation cycling through event.imageURL images
LLM-generated itinerary via Together.ai Llama-2Verified
Query Google API again for similar locations and pass data into Together.ai's Llama2 model to generate a custom itinerary
Claimed on Devposthigh confidence
- convex/myFunctions.ts:66 — generate_itinerary action builds a prompt from liked/disliked attractions and calls Together.ai's api.together.xyz/inference with model togethercomputer/llama-2-70b-chat
- convex/myFunctions.ts:274 — parseItineraries regex-parses the LLM's numbered list output into attraction names
Location, duration, and budget input on homepageVerified
User selects destination, duration of visit, and rough budget
Claimed on Devposthigh confidence
- src/Search/search.tsx:16 — validCities list plus day counter and price buttons (0/1/2) captured in state, passed via onNextStep(location, days, price)
- src/App.tsx:22 — App.tsx onNextStep handler stores location, days, priceRange from Search step
React TypeScript frontend with Convex backendVerified
Built using React Typescript for the frontend and Convex for the backend
Claimed on Devposthigh confidence
- src/main.tsx:1 — main.tsx wires up ConvexReactClient/ConvexProvider around the React app
- convex/schema.ts:1 — Convex schema and query/action functions in convex/ implement the backend
Tinder-style swiping interfaceVerified
Easy-to-use swiping interface, Tinder-style card swiping with CSS animations
Claimed on Devposthigh confidence
- src/Carousel/TinderCard.tsx:98 — swipeRightAnimation/swipeLeftAnimation keyframes translate the card off-screen on accept/reject
- src/Carousel/index.tsx:131 — handleAccept/handleReject set swipeDirection and advance cardIndex, driving the TinderCard animation
Curated list of up to 30 restaurants/attractions/activitiesCode-supported
Presents a curated list of up to 30 restaurants, attractions, and activities
Claimed on Devpostlow confidence
- convex/backend_api.ts:5 — get_attractions queries a Convex 'attractions' table filtered by city and price range, but no limit(30) or cap is applied anywhere in the query
- src/Carousel/index.tsx:193 — Carousel fetches attractions via convex.query and shows the full unfiltered result set, not capped to 30
Google API integration for attraction/restaurant dataCode-supported
Pass location and price range into the Google API to retrieve highest-rated attractions and restaurants
Claimed on Devpostmedium confidence
- src/data/data_scrapper.py:19 — Python script calls Google Places nearbysearch and details endpoints to build the attractions dataset, but this appears to be an offline scraper used to populate Convex, not a live in-app API call
- convex/schema.ts:8 — attractions table (with photo_url, rating, etc.) matches fields the scraper produces, implying pre-scraped data is queried at runtime rather than live Google API calls
Minimum 8 swipes before itinerary generationCode-supported
After a minimum of 8 swipes, convert opinions into a full itinerary
Claimed on Devpostmedium confidence
- src/Carousel/index.tsx:232 — ContinueButton only appears when cardIndex > 6 (effectively 7+ swipes), an approximate but not exact match to the claimed minimum of 8
Booking/reservation and check-in featuresClaimed only
Future: check availability and book reservations, check in to locations and provide feedback
Claimed on Devposthigh confidence
Social sharing of itinerariesClaimed only
Future: social media component of sharing itineraries with friends
Claimed on Devposthigh confidence

An AI agent derived these features from the project’s Devpost page and readme, then searched the code for each one. Verified features are backed by cited code; claimed-only features had no supporting code, which is not by itself proof a feature is missing.