Skip to content

GitLab

  • Menu
Projects Groups Snippets
    • Loading...
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
  • Sign in / Register
  • ReactChallenge ReactChallenge
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 0
    • Issues 0
    • List
    • Boards
    • Service Desk
    • Milestones
  • Deployments
    • Deployments
    • Releases
  • Packages & Registries
    • Packages & Registries
    • Package Registry
    • Infrastructure Registry
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Commits
  • Issue Boards
Collapse sidebar
  • Jobsity
  • ReactChallengeReactChallenge
  • Wiki
  • React Challenge Instructions

Last edited by Jobsity Aug 06, 2021
Page history

React Challenge Instructions

Description

This project is designed to test your knowledge of front-end web technologies and assess your ability to create front-​end UI products with attention to details, cross-browser compatibility, standards, and reusability.

Assignment

The goal of this exercise is to create a demo calendar application using React.

You should start by rendering a single month view of a calendar for the current month, along the lines of the illustration below:

Mandatory features

  • Ability to add "reminders" (max. 30 characters) for a day and time specified by the user. Also, include a city.
  • Ability to edit reminders - including changing text, city, day and time.
  • Add a weather service call from MetaWeather, AccuWeather or VisualCrossing and get the weather forecast (e.g. Rain) for the date of the calendar reminder based on the city.

Bonus (Optional)

  • Expand the calendar to support more than the current month or year.
  • Properly handle overflow when multiple reminders appear on the same date.
  • Unit test the functionality: Ability to add "reminders" (max. 30 characters) for a day and time specified by the user. Also, include a city.

Considerations

  • Show us in the Readme all relevant information about your project.
  • The project is completely focused on Front-end. Ignore the Back-end.
  • Create your Calendar using the route /calendar
  • Feel free to use small helper libraries for: -- UI Elements. -- Date/Time handling.
  • You must create the calendar component yourself. Do not user calendar libraries like FullCalendar or Bootstrap Calendar.
  • Provide working API keys to any external API you use.
  • We have implemented Redux thunk for state management, but you may use any state manager you are familiar with.
  • Show us your capabilities on CSS and styling, if possible.

How to deploy

  • Run npm install | yarn install to install all dependencies.
  • Run npm start | yarn run to run the app locally.
  • You can find the project running on localhost:3000.
Clone repository
  • React Challenge Instructions
  • Home