#100DaysOfWeb in Python Transcripts
Chapter: Days 29-32: Static Sites
Lecture: Writing our first post!
0:00 Okay, it's time to create our very first post or page. Again, looking at our folder here we have our virtual environment activated
0:10 and we have the Skeleton bare bones framework. Let's pop into that content folder. Remember, content folder is where all of the source files
0:21 or the schematics for your site live. And once Pelican has its way with it with the content folder it then dumps all of that outputted HTML
0:33 into the output folder that you also see there. So, let's hop into content. We have nothing in there. Let's create our first post.md file.
0:47 We're going to go with an .md file, a Markdown file so we can use that format. Alright. Now, to get started we actually don't just start writing.
0:58 What Pelican needs to be able to generate this page is it needs a series of little markers, I'll call them at the top of our file, alright
1:10 and it takes these markers and that's how it generates the HTML that's how it knows what it needs to do. You'll see what I mean in just a second
1:20 when you see what these markers denote. So, the first one is title. It needs a title. I'm going to just go really, really generic here.
1:30 Let's get this party started. Right, so we've got our title little flag here. Next up, we need a date. Alright, this is a date that's going to show up
1:42 on our articles and help place this article on our page on our website. And the format, let's go with 2019, month and day.
1:55 Let's go with 31st of March and the time let's just call it 22:00 not that it's 10:00 pm or anything. Now we need a category
2:05 because all of that articles can be searched by category. They are stored based on the category on our site. And this category, I'm throwing in Python.
2:15 Super creative there. Now, we have tags. These are the tags that you know, I suppose would have to do with your content.
2:24 What is this article going to be about? Think of these like your hashtags and your tweets and whatever.
2:30 We're going to say a tag for this one is 100 days of web. It's separated by comma. We can then say it's also about Python
2:38 and we're going to say it's about awesomeness because this is totally awesome. Now, slug, slug. If you haven't heard the term slug
2:48 that is just a really gross way of saying URL. Because no one likes slugs. Pretty sure, no one likes slugs.
2:56 And the URL of this post is going to come up as your domain. So if we're going to use the PyBites example it'd be PyBites forward slash and then this
3:07 whatever you type here. I'm just going to go, again, really generic and call this first post but you could call this whatever you want.
3:16 This is just going to be this page's URL. The slug, whoa, for this page. Authors. As it's just me, we're going to say the author is Julian.
3:28 And finally, we're going to have a summary. So I'm going to write this is a summary of the first post written for our Pelican block.
3:45 We're using this for the 100 days of web course. Done. Alright. One other thing I will throw in here but I'm going to delete it in a second
4:00 is the term draft. Alright, if you have draft here, with true this essentially tells Pelican this is a draft post
4:11 and it should not show up on the main website under our default slug. It will actually show up on the website as
4:19 using PyBites as an example, PyBites/draft/slug. Alright, so when you're drafting a post you can put that there
4:29 and then when you're done, delete it and save it and then it will show up on the normal website. Right, let's add some more content in here.
4:38 Now, we can actually start writing. So, let's go with a big heading for a big day and we have double hashes there. That's Markdown format.
4:48 That's a certain size of a header. This is the first paragraph of our article. If I can spell. Hoo-zah!
5:01 And we want this, the reason I'm putting this all in is because when we render the website shortly we want some content there, okay?
5:13 And I'm teaching you a bit of Markdown here so we can use two stars symbols to indicate a bold.
5:28 So if we use two stars around a word or a term or anything that indicates it's going to be bold formatted block of text.
5:38 Now, let's change the header size a slightly smaller header and we can also use, here's some more Markdown for you a single star around a block of text
5:58 to indicate an, and here's a special word for you an italicized word. Get that star in with a shift. Alright. And that's it.
6:12 Let's go with the end, cool story bro. And that is our first webpage. So right-click, we can cap that out just to see how it looks.
6:30 We have our first post we have the slug, we have all that stuff there big heading, so on and so forth, that's it. Finish completing your first post.
6:41 Go through and make it as big and lengthy as you want and in the next video we will now actually use Pelican and launch it into the browser.