Skip to content

Website created in React in a MVP architecture, calls to a SL and a weather API. Utilizes technologies such as Firebase, JSX and Heroku

Notifications You must be signed in to change notification settings

Hawkrin/KTH-DH2642-TentaSchedueler

Repository files navigation

DH2642-Exam-Routeplanner

A "todo/task" app which was made in the course "Interaction Programming and the Dynamic Web". The app was especially made for planning out/scheduling school stuff like tests etc. SL Api is used so you can search for journeys you need to make, for instance if you need to get to school etc. A weather api is also used and combined with the SL api, so the weather at the source and destination is shown

We're using MVP, which clearly can be seen via the view and presenter folder.

If you create a note then the journey diplayed in the summary view of the note will always be the upcoming "next journey" aka the data updates all the time.

The website is built and justified so it also should be able to function at the different @media widths of 480px, 600px and 800px and 1250px

Setup:

  1. You will be meeted by a sign in page. If you have an account(which you wont have the first time you try it). Click on the "Not a member yet? Register now" link and you will be routed to the sign up page. Enter your information and press sign up.

  2. You will then be redirected to the main "home" page, when you are new to the site you will only see a square with a plus-sign. This is the button that is used to create notes/todos. Click on the button and you will be redirected to the page where you can create a new note.

  3. Here you will required to enter something in each field. At the top you can enter a title, which will be seen together with the journey you pick on the home page. It's good to pick a title you can remember because if you create a lot of notes you will be able to search for the title in the seachbar at the top. When you have entered a title, then you can enter which path you need to travel to get where you are going, for instance the path to school. Then you can make some notes in the editor down below. You can change fonts, make bullet points, make a matrix etc. The add picture function is not implemented though. Then when you are done just press the CREATE button.

  4. When the CREATE button is pressed you will be routed back to the Home page. Where you now can see the note you just created. The title and the path are displayed on the note. If you then click on the note, you will be routed to a summary page for the note you clicked on. Here on the summary page all data will be displayed, both the information you wrote, as well as how you should travel from your source to your destination(the route is displayed).

  5. Extras: -You can always click on the home button on the header to be routed to your home page -You can always sign out by clicked on the sign out button on the header -As mentioned before you can search for the notes you have created via the searchbar when you are on the home page.

  6. Technologies used: Firebase, React, Node, Heroku, CSS

HomeScreen homeScreen

HomeScreen @media homeScreen

SummaryCardView homeScreen

Card creator page homeScreen

Sign up page homeScreen

Sign in page homeScreen

About

Website created in React in a MVP architecture, calls to a SL and a weather API. Utilizes technologies such as Firebase, JSX and Heroku

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published