Teste Técnico Frontend

Jobsity

Javascript, CSS, React

New York - Estados Unidos

Software | RH

50 - 200

/jobsity-llc
git.jobsity.com/jobsity
jobsity.com

Jobsity é uma empresa de terceirização de desenvolvimento web que disponibiliza desenvolvedores incríveis da América Latina

Sobre o Teste

Este projeto é um desafio de desenvolvimento front-end que se concentra em criar uma aplicação de calendário de demonstração usando React. A tarefa principal é renderizar uma visualização de mês único de um calendário para o mês atual. Os recursos obrigatórios incluem a capacidade de adicionar e editar lembretes para dias e horários específicos, incluindo informações da cidade. Além disso, o projeto requer a integração de uma API de serviço de clima para exibir a previsão do tempo para a data e cidade de cada lembrete do calendário. Também existem recursos opcionais adicionais, como expandir o calendário para suportar múltiplos meses ou anos e lidar adequadamente com o excesso de lembretes que aparecem na mesma data. O projeto deve ser documentado em um arquivo README, e o desenvolvimento front-end deve ser feito usando React. As habilidades de CSS e estilização também são incentivadas a serem demonstradas. Para implantar o projeto, instale as dependências usando npm install ou yarn install e, em seguida, execute o aplicativo localmente usando npm start ou yarn run. O projeto estará acessível em http://localhost:3000.

Instruções do Teste

Link para o teste técnico original

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.

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 use 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

  1. Run npm install or yarn install to install all dependencies.
  2. Run npm start or yarn run to run the app locally.
  3. The project will be available at http://localhost:3000.