itinerarey

Did I get work done on the hotels part? No!

BUT, I did some very needed work on the flight system so that it should work in general. The main issue was that there was no way to convert from cities to airport codes, but I sat down and actually got it done.

When the user enters a city and goes to the flight screen, a modal now appears. In the background, a function runs that gets the coordinates of the city, and then creates a 100 km circle around the location, returning all airports inside of it!

Originally, the plan was to use nominatim for the geolocating, since it’s free, open source, and the goat, but I may have gotten IP banned for having it run 60 times a second for a good few minutes. (This is around 60 times the amount I am supposed to do it). I forgot to remove a variable from a dependency array. ANYWAYS, I used Mapbox instead! I have some experience with it, and its free tier is pretty comprehensive.

Once the locations show on the modal, they choose which ones, it reloads to show departures, and then the same system as before applies! This works SO much better, and I’m really proud of the system.

So, I got some work done on itinerarey since.

Mainly, I’ve been working on error trapping and trying to find a hotel’s API. Firstly, I am trying to use airport-data-js to convert city names to airports, but it returns the incorrect values usually.

Otherwise, I got the base for the hotel page done. It’s going to look pretty similar to the flights, just with different information. Currently, I need to find an API that works for hotels, but it’s going to be a bit of a struggle. I tried fast-hotels, but they are no longer maintained, or at least the current version broke on me.

Wish me luck!

The flight system is complete!

To reiterate how it works, once you put in a date, a render server with an API is called that uses Python to scrape Google Flights and return (hopefully) accurate flight data.

Then, a user chooses the flight they want, it gets saved to the cookie, and it does the same actions for the return flight. The main issue I had with this was getting to swap between departure and returns, since it required some refactoring of the code. It wasn’t anything too bad, though.

Next up is going to be finding a hotel API. This is going to be probably just as annoying as with the flights, but there is only one way to find out. That’ll be tomorrow, though; I am so tired right now lol.

Lastly, I am writing this 3 minutes before my time as a Stardance Ambassador ends. I want to thank the team for letting me take this role; Nay-nay and Alex for their help; and everyone whom I’ve interacted with. While the role is done, I’m going to finish this project!

Now, the flights will actually show up in the website! Using the API, I get an array, and then each flight is put into a custom object that allows it to be displayed!
Each option includes basic info such as airline, price, legs, locations, timings, and more! Now that it is styled, the next goal is to save flights to the cookie, and than rerun the same process for the return flight! Overall, I think it looks pretty good!

This time is fully my bad, I sort of (100%) forgot about this. ANYWAYS, I got some of the biggest progress done yet.

Firstly, I got trips to save as cookies in your browser, since its an easier way for me to store data across the website. dont worry, im not stealing your data or anything lol.

Then, I did some research (with help from Claude) and found fast-flights, a Python library that is basically a Google Flights scraper, so it works perfectly. Except it’s a Python library… on a React website. So, I created a seperate repo that contains an API that requests the library and hosted it on render.com.

One note is that the links supplied reroute to google flights, so users will have to be careful with choosing correctly. Sadly, theres really no good free options for a flight API (literally everyone shut theirs down lol).

Lastly, I connected it all together by writing the base code for querying the API and getting the data back. I do need to actually format it, modify it to work with my data, and display it. But, its a good stopping point for now.
By next time, I want to have the flights page looking good, and my API to be more polished!

So… its been a minute!

I’ve been out of state doing an engineering program at ND for the past few weeks, and I am FINALLY back home!

So, here’s what I got done today!

I finished the layout (for now) on for the planning page. For now, you put in the departure/arrival, number of people, dates, and overall budgets.

The worst part of getting it to work was the date picker. I spent like 2 hours researching different date-range pickers and trying them out, such as react aria, react-date-range, and more.

Eventually, I settled on cally since its lightweight, easy to customize, and didn’t require me to spend 3 hours making it work!

I also created a new input type to shrink the file size down.

For the future, I plan to get data to actually save in the app, and then start looking for a flights API.

The API is going to be an issue. There is really not a lot of choices for a free and large-scale API for what I want. But, its the internet. Theres gotta be something!

the website thats published isn’t updated yet, since I have some code that needs to be implemented before I can redeploy.

I started to get some work done on the planning settings! Mainly, I need to track budgets, dates, and what the user actually wants to do and spend money on. The main issue I am currently having is making the date system work. I am going to do more research, though!

The home page is completely done! I spent around an hour adding in all of the other info, mainly about how the program works. I also spent a decent amount of time redoing the file structure of the website, just so everything is more organized.

Now, I have to find the APIs I need. Google Flights doesn’t have one, so I am going to need to do some deep research.

Been on vacation so progress been slow but here’s what I got done!

Mainly, the search bar is done! I haven’t been able to program my custom algorithm yet, so right now it just links to google maps. I tried to mimic websites like Kayak and Google Earth, and I think its pretty decent.

The main issue I had was with the website crashing when clicking the search bar. ThreeJS couldnt handle the pointer event (it doesnt really make sense), but with changing the z-order and adding a LOT of e.stoppropagation() fixed it.

Overall, good progress, and next post I want to get the home page done!

Two major things for today: I fixed responsiveness, so it looks better on small screens. Also, I started work on the search bar. I have to style it, but its coming along well!

shoutout to my friends @ fallout, wish i was allowed to come with! enjoy!

Card system works! When you click on a point (I added more), with around 3 per continent except Australia, a popup with basic info, a photo, and a button shows up. The button will eventually go to the itinerary algorithim, but for now just links to google maps.

I have to make it responsive, but tomorrow I will (hopefully) finish the base page.

check it out here!

Itinerarey (get it?) is going to be a website where you can put in a plan for a trip and get a full detailed list of what you can do, taking into consideration price, dates, and suggested ideas.

I got this idea while waiting at EWR for 3 hours before my flight got cancelled, lol. I was supposed to go to Atlanta, and I would have had a free day by myself. If I had this, I could have figured out what to do.

The plan is to take data from APIs to get flights, hotels, and other stuff, and combine it with AI to get a full list of what to do!

But, so far, all I got done is the start of the hero page. I want to have a globe spinning in the BG with points that can pop up some ideas, which I got done using globe.gl.

The points are not coded in yet to pop up, but that’ll be later.