This is a simple calendar application that allows a user to save events for each hour of the day by modifying starter code. This app runs in the browser and features dynamically updated HTML and CSS powered by jQuery. Employees oftentimes have very busy schdules and utilize a daily planner in order to manage their time effectively. This application uses the Moment.js 2.29.1 library to parse, validate, manipulate, and display dates and times in JavaScript.
Given that an individual would like to use a daily planner to create a schedule...
- When you open the planner, the current day is displayed at the top of the calendar
- When you scroll down the webpage, you will be presented with time blocks for standard business hours (9am-5pm). Each time block is color-coded to indicate whether it is in the past, present, or future
- When you click into a time block, you can enter an event
- When you click the save button for that time block, the text for that event is saved in local storage
- When you refresh the page, the saved events persist
The following animation demonstrates the applications functionality:
This web application is responsive, meaning that the layout and content responds and adapts based on the size of screen in which it is presented on. See Example Below:
You'll need to use the Moment.js library to parse, validate, manipulate, and display dates and times in JavaScript. Be sure to read the documentation carefully and concentrate on using Moment.js in the browser.
To install this project locally clone this project repository to create a local copy on your computer and sync between the two locations. You may then modify the code to your liking. For steps on how to clone a repository using the command line, read this section of the GitHub Docs about cloning a repository.
This simple calendar application can be viewed at: this link.
The original webpage skeleton and basic style templete (index.html and style.css) was provided on behalf of the UC Berkeley Coding Bootcamp, which I then enhanced.
