Astro Booking - Booking Experiences for a Seamless Journey

February 2023

AstroBooking screenshot

Introduction

Ever got that frustrating feeling when you’re trying to book something online? Oh boy, have I been there. It’s like a maze of confusion and snail-paced loading, driving you up the wall. But wait, here comes the hero of the story – AstroBooking! I rolled up my sleeves and built this bad boy to save us all from booking blues. Trust me, it’s like a magic wand for reservations, working like a charm on your trusty smartphone too.

So, there I was, on a mission to level up the whole booking game. AstroBooking became my sidekick, a compact yet mighty booking engine built to make life smoother – at least when it comes to reservations (you feel me, right?). It’s all about letting you book stuff like a breeze, even when you’re on the move.

AstroBooking, a small booking engine designed to make your (or at least mine :) ) reservation process smoother and more enjoyable, even on the go.

Annoying Search and Flashing Red

Have you tried to book on the website, but it was hard to understand, flashing everywhere, and took forever? I’ve been there too. I looked at many different websites to find an easier way. I could find some, but not entierly satisfied I decided to create my own and see where it goes : That’s how AstroBooking was born.

a simple room, as things should be

AstroBooking: Easy Fast, and Reactive

AstroBooking? Well, think of it like your typical booking sites, just on turbo mode. How? I cooked it up with this snazzy framework called Astro JS. That means no more twiddling your thumbs while waiting for the backend to catch up. And here’s the secret sauce: REST API. It keeps everything up-to-date, so you’re always in the know, no need to hit that pesky reload button.

Now, let’s unpack how I nailed down the room order. Imagine you’re scrolling through, tossing items into your cart. That’s where Svelte gets its groove on. See, it’s got this nifty thing called reactivity – a real game-changer. And then there are these cool “stores” in Svelte. They’re like data superheroes, all gathered in one spot.

So, when you toss an item in the basket, the Svelte store waves its wand and bam – your whole screen updates like magic. No manual fuss, no tedious refreshing. It’s like having your own tech-savvy assistant, keeping things slick and seamless.

automatically updates as the items are picked

Mobile experience

One big point of this was about optimizing the basket functionality with the mobile user experience, and I think we’ve nailed it.

I’ve managed to keep the basket fixed at the bottom of the screen. It’s like this sticky thing that’s always there, and it’s really handy. Taking a closer look at it, you’ll see two buttons – one to actually make the booking and the other to tweak the stuff in the basket. Also, to make things crystal clear, there’s a small arrow that hints at how to open the basket. I’m keeping it simple, though, not overloading it with too much info that could stress users out.

clear and simple fixed navigation bar

A neat trick is that the list of rooms or items you want to book takes up the whole screen. This way, when you’re scrolling through, there’s no distractions, just pure focus on what’s important. This way, users can focus on the options available without any distractions. It’s a clean and clutter-free experience that we believe will help users make decisions more easily.

the summary, smoother and more user-friendly

And perhaps the most exciting part is the speed. I’ve put in some work to make sure everything responds lightning-fast. It’s almost like using a native app, which is exactly the kind of experience I were (somehow ?) aiming for.

Picking Dates Made Simple

One cool thing about AstroBooking is that it’s easy to pick the dates you want. No more confusing calendars. I made it super simple. Plus, it works great on your phone, so you can book things while you’re on the move.

the sleek DatePicker with prices on it

What’s Next?

Well, AstroBooking is like the opening act of a great show. Right now, it’s not packing every trick in the book, but trust me, I’ve got big plans. I’m just keeping it alive for now, but considering cranking it up the awesomeness.

As I delve into this adventure, I’ve come to realize a thing or two. Booking? It’s a whole new dimension of complexity. I mean, there’s the super cool stuff like playing with tab indexes to make navigation a breeze, and diving deep into accessibility to make sure everyone’s got a ticket to the booking party. But then, there’s also the realization that this booking gig is no walk in the park. It’s intricate, it’s dynamic, and it’s definitely not a one-size-fits-all deal.

So, here’s to more learning, more tinkering, and more magic. As I peel back the layers of this booking world, I’m discovering a universe of challenges and possibilities. And you know what? I’m all in, ready to push the boundaries and create an experience that’s not just good, but downright amazing.

I really think like it’s a big journey that’s about to begin, not just a simple PoC. It may not be about Booking, it may not be about Astro, but PoC I’ll make from this will certainly be even better :)

Also Read

  • Reports generator

    RIRGen

    Using the JavaFX runtime and some streamed CSV JDBC, the report generator was designed to quickly produce provisional quotes as a branded Excel file using Apache POI.

    • JavaFX
    • Reporting
    • CSV
    • XSLX
    • POI
  • Discord in SvelteKit

    Skelord

    Implementing some of the Discord UI and learning how they do VirtualScroller, with Sveltekit once more !

    • SvelteKit
    • REST
    • Discord
    • PoC
    • WiP
  • ETL Search Engine

    AyaMe

    This tool was made to provide search capacity among ETL-extracted sensor data.
    It was using a synoptic parser and a fast-index search library.

    • TailWind CSS
    • Python
    • SvelteJS
    • LunrJS

Want more ?

I've got a lot of other awesome projects

See them all !