A Blog. Made From Scratch.
Other Website Features
It goes without saying, but I have invested a significant amount of time into this website. I wrote every line of HTML, CSS, Javascript, PHP, and SQL myself. I'll highlight some of the newer features in the rest of my website. I used HTML5 for embedding video and the pdf, as well as for local storage to determine if this is the user's first time visiting my website. I used CSS3 for rounding out text box edges, creating the tooltip pointer for displaying comments, and for the gradient background. I also used JQuery animations throughout the site, specifically when displaying the lists of courses I've taken.The Blog
Now I'll describe some of the specific features I chose to implement in my blog. Each blog post is stored in a MySQL database, along with the post's title, ID, and creation date. Each post is retrieved from the database, formatted, and then displayed on the page. Newest posts are displayed at the top of the page, and older ones at the bottom.There is a separate database table for comments. Each comment entry in the database also includes the blog post's ID, the name of the user that created the post, and the date the comment was added. The number of comments for each blog post is calculated and displayed when the page loads. By clicking on the comments section of each blog post, an AJAX request is sent to query for and obtain the specific comments for that blog post.
Logged in users have the ability to add a comment. By clicking on the 'Click to comment' text, the screen grays out and a form for adding a new comment appears. After submitting a comment, the user is brought to a confirmation page. When the blog page is reloaded, the number of comments will be updated, and the user will be able to view the new comment.
I also created special forms to update and remove blog posts and comments. This allows me to modify my blog posts directly from my website.
Login System
I'll start off describing the first feature I implemented, which is the login system. I imagine there aren't many people with the time and patience to read through long blog posts, so I'll try to keep it brief. The login system is pretty straightforward. First time users choose a username and password, and then click the Register button, and returning users click the Submit button. The username and password are stored in the database, and are verified at each login. Once a user is logged in, a cookie of the user's name and session ID is created. The user stays logged in for an hour, then the cookie expires. The session ID is checked whenever the user opens a new page, and there is a welcome message at the top of each page for logged in users.Hello World!
I created this blog as a personal project to teach myself more about the backend side of web development. I built this blog - and the rest of this website - exclusively by myself in order to gain a fundamental understanding of all the steps involved in web development. (This also ensured that I didn't infringe on any copyrights.) I didn't use a blog template, layout editor, or anything of the sort. I even designed the graphics myself, including the lightning background picture made in Photoshop. The only external library I used was JQuery. All of my testing and debugging was done through Crome's Developer Tools, and all my questions were answered through Internet research.I took an Agile approach to designing my website. I set my overall project goal of building a login system and blog at the beginning, but figured out the details as I went along.
I considered large blocks of free time to be like sprints. I'd first think of what new features I could realistically tackle in the time frame (sprint planning), and then I'd try to finish each feature one by one (sprint backlog). Whenever I finished a complete module, like the login system, I'd upload my code to the department servers (product release).
I enjoyed the opportunity to be my own product manager. I set my own goals, and then worked to achieve them. If I thought a feature was too difficult or time consuming to implement, I would just think of a way to get around using the feature or redefine its specifications.
I've more or less explained the background for my project, so I'll use the next few posts to describe some of the actual features of my blog in more detail.