PackWise

• 

  Home Page of PackWise

• 

  After click on planning the planning section appears here you can add the trip details

• 

  The checklist we provide the checklist as you can select or unselect the checklist you can also add the custom item in checklist

• 

  The track money page here shows the the money you take how much you spend in which things and that's how you can track the money

• 

  Dashboard section

• 

  you can also export the dashboard as a pdf

Inspiration

Every time we planned a trip, we ended up juggling three or four different tools just to get organized — a notes app for the packing list, a spreadsheet for the budget, and a mess of tabs for the itinerary. Something always fell through the cracks — usually a forgotten charger or a budget that quietly blew past what we'd planned. We wanted one simple place that handled the whole pre-trip process, without needing an account, a subscription, or a learning curve. That's what pushed us to build PackWise.

What it does

PackWise is a smart travel companion that takes a trip from idea to "ready to go" in one flow. Users start in the Planner, entering their destination, trip duration, trip type, number of travelers, and budget. From there, PackWise auto-generates a Smart Checklist tailored to those details, which users can check off as they pack and extend with their own custom items. A Budget Tracker lets users log expenses by category and see their remaining balance update in real time. Everything comes together on a Dashboard, showing packing progress and budget status at a glance, which can be exported as a PDF for offline access. No sign-up and no backend — all data is saved locally in the browser, so it's ready the moment you open it.

How we built it

PackWise is built entirely with HTML, CSS, and vanilla JavaScript — no frameworks and no build step, by design, so it stays lightweight and easy to run anywhere. The app is structured as a set of connected pages (Planner, Checklist, Budget, Dashboard, About), each with its own styling and logic, tied together by a shared data layer using the browser's localStorage. This lets information entered on one page — like trip details from the Planner — flow into the checklist generation and budget logic on the other pages, all without a server. The PDF export feature was added so users could take their dashboard with them even without an internet connection.

Challenges we ran into

Keeping data consistent across different pages without a backend or a framework's state management was the biggest challenge — we had to be deliberate about how and when localStorage was read and written so nothing got overwritten or out of sync. Designing a checklist generator that felt genuinely useful (not just a generic packing list) meant thinking carefully about how trip type, duration, and traveller count should actually change what gets recommended. We also spent real time on the UI itself, making sure the flow from Planner through to Dashboard felt smooth and didn't require any instructions to understand.

Accomplishments that we're proud of

We're proud that PackWise works end-to-end with zero setup — open the file and it just works, no installs, no accounts, no dependencies. The auto-generated checklist logic and the live-updating budget tracker were the two features we cared about getting right, and seeing them work together seamlessly on the Dashboard felt like the payoff for the whole build. We're also proud of keeping the whole experience clean and responsive despite having no framework to lean on.

What we learned

Building without a framework forced us to really understand state management from first principles — thinking in terms of "what data exists, where does it live, and who reads it" rather than relying on a library to handle it for us. We also learned a lot about designing for a real user problem instead of just a feature list: the checklist and budget tools only became genuinely useful once we started asking what would actually save someone time, not just what was technically interesting to build.

What's next for PackWise

Looking ahead, we'd like to add weather-based packing suggestions pulled from a live API, so the checklist adapts to real forecasted conditions instead of just trip type. We're also considering shareable trip plans, so travellers going together can collaborate on one checklist and budget instead of duplicating the work. Longer term, we'd explore optional cloud sync for users who want their trips available across devices, while keeping the current no-login experience as the default.

Built With

• css3
• git
• github
• googlefonts
• html5
• javascript
• localstorage
• responsivedesign
• svg