2019 Calendar App: Let's Build It!
4.4 (42 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
4,823 students enrolled

2019 Calendar App: Let's Build It!

Build a real world web application using HTML, CSS, Javascript, PHP and MySQL.
4.4 (42 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
4,823 students enrolled
Created by Jesse Caine
Last updated 3/2020
English
English [Auto-generated]
Current price: $13.99 Original price: $19.99 Discount: 30% off
5 hours left at this price!
30-Day Money-Back Guarantee
This course includes
  • 7.5 hours on-demand video
  • 4 articles
  • 14 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Build a real world web application
  • Use CSS media queries to make your pages responsive
  • Use Javascript to create & control the operations of an application
Course content
Expand all 65 lectures 07:41:40
+ Introduction
4 lectures 05:20
About the App's Appearance
00:14
The Tools I'm Using
01:34
Getting the Course Files
00:07
+ HTML/CSS - Making the Left Side
4 lectures 27:58
Setting up the Index
02:28
Writing the Left Side Markup
03:38
Writing Generic Styles
06:38
Styling the Left Side
15:14
+ HTML/CSS - Making the Calendar
4 lectures 42:28
Writing the Calendar Markup
06:59
Styling the Calendar: Part 1
10:00
Styling the Calendar: Part 2
07:25
Styling the Post-its and Tooltips
18:04
+ HTML/CSS - Creating the Popups
5 lectures 40:43
Setting up the Modal
06:52
Creating the Theme Markup
05:07
Styling Theme Popup: Part 1
10:46
Styling Theme Popup: Part 2
06:15
Creating and Styling the Create Note Popup
11:43
+ JS - Setting the Current Day Values
5 lectures 22:32
Writing the updateCurrentDates() function
06:50
Continuing the updateCurrentDates() function
04:18
Adding Ordinal Indicators
04:10
Translating Month/Day Numbers to Strings
03:40
Writing the UpdateCalendarDates() Function
03:34
+ JS - Filling the Calendar
9 lectures 01:18:12
Using month_data
06:53
Writing the fillInCalendar() Function: Part 1
08:09
Writing the fillInCalendar() Function: Part 2
09:26
2020 Update - Fixing Month Data
13:40
Writing more Functions
07:10
Changing Months on the Calendar
09:12
2020 Update - Calendar Navigation
05:05
Fixing the Color Problem
03:09
Calendar Borders
15:28
+ JS - Updating the Theme
5 lectures 39:52
Using color_data
07:37
Triggering the Modal
08:29
Updating Color Data
09:13
Updating the Theme
07:24
Adding Check Marks to the Current Theme
07:09
+ JS - Posting Post-it Notes
7 lectures 44:14
Embedding Data into the Table Cells
07:55
Trigger a Function when Cells are Clicked
06:19
Adding post_it objects to post_its array
08:03
Writing the Function to Add Notes/Tooltips to Cells
05:08
Posting Notes
03:42
Editing Notes
07:29
Deleting Notes
05:38
+ Final Touches Before PHP
6 lectures 51:13
Cleaning up the Index
02:54
Note about cleanCells()
00:51
Fix "Calender" Misspelling
10:33
Refactoring Code
08:46
Refactoring FillInCalendar()
16:07
Re-styling
12:02
Requirements
  • Know Basic HTML, CSS & Javascript
Description

This entire course is one big code along, broken up into byte sized chunks.  I start by creating the markup and styling all the pieces.  The  I use JavaScript to add all the front-end functionality.  Then at the end I start using PHP and MySQL to connect to a database to make all of the changes made in the front end persistent, so that the app will remember how it was the last time you used it.

Keep in mind that there may be some technologies used in this course that you aren't used to using.  I use Flexbox, AJAX, MySQL, etc.  These technologies aren't aren't taught in this course, as that isn't the main objective, for me, these technologies are just a means to an end.

Who this course is for:
  • Novice web developers who want take there skills to new level by building web applications.