This project was an assignment task for a FED position I applied some time ago.
The goal of this exercise is to create a demo calendar application using Angular.
You should start by rendering a single month view of a calendar for the current month, along the lines of the illustration below:
- 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 OpenWeather and get the weather forecast (e.g. Rain) for the date of the calendar reminder based on the city.
- 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.
- 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.
- Show us your capabilities on CSS and styling, if possible.
- Cities suggestions and forecast is consumed from the OpenWeather API's. To enable it, add a valid API KEY to
environment.OPEN_WEATHER_KEY
, inenvironment.ts
. - Weather is visible once the reminder is saved. You can see the description below the city field in the edit reminder popup.
- No new packages added.
Run ng serve
for a dev server. Navigate to http://localhost:4200/
. The app will automatically reload if you change any of the source files.