Python calendar output in HTML format

Hi there everyone. 👋 How's your weekend going?
Hope you are doing well. 🙂

So, as you read the title, I am gonna share with you about creating a Calendar in python and making its HTML version using a python command.

Prerequisites 🎒

• A bit of knowledge of Python,
• A bit of knowledge of HTML and CSS,
• Willing to code.

---

Coding ☕️

Let's start by opening the command line app cmd in windows or terminal in mac os,
and start typing the following commands.

python -m calendar 2021

• This command will output the calendar for the whole year.

python -m calendar 2021 1

• This command can be used to print a particular month.
  
• 1 is used for January in this example:

---

Adding HTML tags to the Calendar using Python command ➤

python -m calendar 2021 -t html

• This will gives the html output of the specified calendar.

• Just copy the html part and open your favorite code editor.
  I am using VS code.
• Create a new file and name it pycal.html.
  
• Now paste the html code in this file.
  

• Well, we have now reached the designing mode of our calendar.
  Don't worry if the code looks too big. We are going to do some cool tricks in our next steps.
  👍
• Toggle the <table> tag to collapse its content.
  
• Now add div containers as shown in the below example.

Adding CSS styling to our calendar. ➤

• Create a CSS file in the same folder as calendar.css.
  
• Now add the following code in that CSS file.

  .grid-container{
       display: grid;
       grid-template-columns: auto auto auto;
       text-align: center;}
  .grid-item{
       padding: 10px;
   }
  .grid-item2{
       padding: 3%;
       text-align: center;
       margin: 15px;
   }
  body{
      text-align: center;
      background-color: rgb(249, 240, 255);
  }
  table{
      margin: 10px;
      padding: 10px;
      width: 100%;
      background-color: rgb(255, 255, 255);
      border-radius: 5%;
  }
  

• So far our calendar looks like this :

Giving final touch to our calendar ➤

• Add the following code in the CSS file :

  .mon{
    color:blue;
  }
  .sat{
    color: rgb(130, 20, 220);
  }
  .sun{
    color: rgb(233, 28, 124);
  }
  th1{
    color: crimson;
    margin: 100px;
  }
  

• This will color-code all the mons, sats and suns

  Awesome. ✌🏼

  We have completed our Calendar app which looks like this :

Summary. 💁🏽‍♀️

• Modules used:
  • Calendar module (python)
• Other languages used:
  • HTML and CSS (for styling only)

---

So, this is how we can create. a calendar app in HTML format using python.
And the best thing is, we have used only one line of python code to create our calendar.

Hope you like this article/tutorial of my series Random-Coding.
Please read my other articles of this series as well for more cool and fun projects.

I will meet you through my next article soon. Till then, stay connected with me through Twitter and Discord

Keep Coding, keep growing ☕️

References: 📚

Use the following help command.

python -m calendar -h