Skip to content

Client App - Your own idea or Weather App

Image 01

For this assignment it is your job to plan, code, test, build and deploy a client application with your own idea or a weather app using a some web framework. You application should work in desktop web browser or some other client based "device".

Recognition of Informal Learning

Contact Pasi Manninen, if you think that you are already a very skilled with client side programming and you have worked with some client programming technology. You don't need to write any official papers/applications for that one. We can just arrange a code review meeting together.

Your own idea - main plan

You need to do frontend/client based application in this assignment. If you are using your own idea, then you need to discuss with teacher to get approvement.

Tip

Remember that you can create one full stack application which UI/client is created in this course and backend is created in YTSP0200 - Data Modelling and Back-end Development course.

Weather App - backup plan

If you don't find your own app idea you can create a Weather Forecast application.

Pasi has created a sample Weather App using React that has some of the core and extra features included. You can find weather app from here Weather App. Demo uses The Finnish Meteorological Institute's open data. You can use this as an inspiration for your assignment.

Other services (to get inspiration):

Core requirements

  • User can search for a forecast using a location selected
  • App displays weather forecast for selected location (temp, wind, etc..)
  • User can add a location as a favorite
  • User can remove a favorite location
  • User is able to see a list of favorites and select one to display its weather forecast

Extra requirements

  • Locations for the search are loaded in a autocomplete field
  • User favorites are stored to localstorage (available between launching time)
  • App uses some UI framework
  • App shows forecast for multiple days
  • App uses some graphs for forecast
  • App uses less, sass or similar for extra styles
  • App uses a router such as react-router for multipage app
  • User is able to share a link which automatically loads the weather forecast for the location
  • Ex. https://example.com/station/30120 loads the page with current weather forecast
  • Usage of webpack, babel or similar
  • Deploying the app to gitlab pages

Documentation

You need to include your planning documentation, which includes for example your UI mockups, component's planning, structure of your application, which APIs (and npms) will be used, what features you are going to implement, etc...

You need to keep track of your doing, which includes: day, task/feature information, time spent. Include also total hours. Every student need to keep that! Otherwise your RA will not approved.

Include final documentation which describes what you have done and what planned features are implemented and are working in your app.

At the end, write your own feelings about your work with grade proposal. What parts of the project you found were easy, what parts were hard, what was the greatest learning experience for you during the project, any additional info you might want to provide. Self evaluation grade number about your work.

Remember include link to a video where you demo your app and link to your app in web.

Use your repository README.md (or multiple md's) to create your documentation.

Returning

Create a repository to our GitLab/LabraNet and give Reporter access role to teacher. Assignment due date is when the course ends.

Grading

Grading is based on following:

  • Project work has been done throughout the course (not only in the last days)
  • Informativeness of the documentation
  • Usability of the user interface
  • Number of the completed features
  • App and code structure, cleanes, commenting, error-free code
  • Quality of the code
  • Taking advantage and usage of external frameworks and libraries
  • Deployment of the app
  • Usage of git; branches, commits and possibly issues
  • Results and their analysis
  • Reporting and presentation
  • Extra credit can be aquired by writing some tests for the application or components.

Tutorials and other materials from web

You can use tutorials for learning, but don't completely use any tutorials as your assignment. You need to do something by your own. If you are using some tutorials or any other materials from web, remember iclude those sources to your documentation or source code.

Warning

Don't use already made materials, make your own research! If you need more information about this, just contact teacher.