🙍 We did not do enough research on how to execute our idea with regards to collecting data for ML
😔 We were too tired trying to setup the backend of the project and did not give much thought to the actual final pitch presentation
😭 We did not understand the competition requirements well leading to us losing quite a lot of marks
We are proud to announce that we have made a lot of frontend and backend changes throughout these few short days. Regardless if we win or lose, it is a project that we are proud of. We will be categorizing both frontend and backend changes below. 🌹 Added new and improved sign up and sign in page
🌻 Added skeleton loading when retrieving data from servers
🌺 Better Reservation History selection screen
🌼 More meaningful error messages instead of "Oops, something went wrong!"
🍀 A solid backend that allows you to actually sign in and sign up via authentication and verification
🍁 Unique booking history corresponding to logged in user
🍂 Able to book parking spots according to availability and user input
🌱 Able to check into parking space according to QR Code
🌵 Dynamic pricing shown during booking
🔰 Angular, JavaScript, SCSS and HTML
🔱Firebase Welcome, to start off, we are currently hosting the webpage on GitHub Pages, here https://quickpark-monash.github.io/quickpark-monash-mobile/ Before you navigate the website, we need you to do some adjustments to your desktop internet browser. If you are currently on your mobile phone, please skip to this section.
THE BEST WEB APP EXPERIENCE IS THROUGH YOUR MOBILE DEVICES BROWSER! Press
Option + ⌘ + J
on Mac products, or Shift + CTRL + J
on Windows to open up the Google Chrome Developer Tools
. You should see something like below.
Now, on the top left corner, you should see a
tablet and phone icon
. Clicking this icon will allow you to change the size of your screen as if you were viewing the website on that particular device. When toggled
, you should see the icon glow in blue like so. Your screen will shrink, but that shouldn't stop you from continue reading.
The webpage built is currently adjusted to look good on most *cough* of the mobile devices in the selection option. It started off with the
iPhone X model
, but was soon responsive enough to handle different android and iPhone models
as well. You should see something like so. Then, you can click on the dropdown menu right by the phone model to change it. Make sure to set it to iPhone X
.
Click on the link above and enjoy the webpage! Details about the webpage will be further down the section. If you are currently, on your mobile device, good! We tested that the best app experience is by using your mobile phone. For your convenience, scan the QR Code below to directly navigate to our website. You may also use the initial link on your mobile browser. Since not much testing as been done, we cannot guarantee absolute responsiveness for every device. If positioning seems out of place, remember to view the website through your browser using the steps above. If you've chosen to look at how the insides of our web application works, the process is fairly simple.
1. Run
npm install -g @angular/cli
to install Angular on your local device using your terminal.2. Next, run
git clone https://github.com/QuickPark-Monash/quickpark-monash-mobile.git
to download the files to a directory.3. Then, run
npm install
to install all the required dependencies.4. Run
ng serve
to host your Angular project locally, make sure you're in the project directory5. By default, the webpage should load at
localhost:4200
, follow the steps above to change your Google Chrome device size for optimal surfing.
This is an example of a QR code that will lead to a valid scan. As of now, a valid scan just means a parking space that has not been booked or occupied by any other users.
Any other forms of invalid QR code that our backend does not handle will give you an invalid error pop-up window.