Featuring special guest Kaio Rosa
This is the first part of a series on creating a portfolio website. Kaio (@kaio_rosa) and I met through twitter's #100DaysOfCode Challenge last year. If you haven't checked out 100daysofcode.com, I'd highly recommend the challenge not just to level up your skills but to network and meet amazing people in the dev community. I even wrote an article about it: Planning your first 100 days.
Like a lot of devs in the community, Kaio doesn't have a portfolio website yet. We meet for walk and talks weekly - the idea came up that we should do a screen share and walk through how to create a WordPress website and this article is going to be our guide for our first ever screen-share session. I hope you enjoy it.
I've wanted to learn WordPress for blogging and my portfolio but don't want to pay for hosting to learn, where do I start?
I worked at Flywheel for a while and found out about them through this amazing product they had called "Local by Flywheel". I got to work with Clay, the brains behind it, and that dude is on another level! He originally called it "WordPress-O-Matic" before he partnered up with Flywheel.
Last year, WP-Engine purchased Flywheel and Local By Flywheel with it. The name changed again to Local to be more inclusive of the WordPress hosting community. Now you can completely develop your WordPress site locally on your computer and send with a single click to Flywheel or WP-Engine (and perhaps other hosts in the future).
Head over to localwp.com and click "download" at the top right. Select your platform and provide your details (this is a marketing form, so their sales team will eventually reach out).
After you have it downloaded, open the file and you should be prompted to install it. For Mac you just drag the file into your applications folder.
Agree to their terms and conditions and then exit the sales pitch for Local Pro then log in to your Hub account if you have one through WP-Engine or Flywheel (this step is not necessary).
You will be prompted a bunch of times for admin credentials when first creating a site but we will get into that momentarily
Ok I've installed Local, how do I use it?
I did a ton of the leg work for you so that you can focus on building content and update links appropriately. The idea is to get you up and running with a working portfolio site as soon as possible. You can customize this further and make it entirely your own. The best part is that WordPress is blog centric so as you are learning a new thing, you can blog about it.
Head over to https://share.codingwithdrew.com/4gujpBpl and download the WordPress template I've created for you. It's a .zip file called portfolio.zip
. Do not extract it.
Drag that file you just downloaded into the Local window and drop it. You will be prompted for you computer administrator credentials.
Now that you have Local installed and a template site on it, your local site won't have a trusted certificate. It is generally a bad practice to develop a site on WordPress without an SSL certificate from the beginning because you may see mixed content errors (http files loading over https) when you go live and add an SSL.
We want to trust the local certificate by clicking "Trust" as seen below:
Your site should now be "live" (locally) now. If you click the "VIEW SITE" button on the top right of the Local App you can view the template I've created for you. It should look like this:
How do I access/customize this Site?
Back in the Local app, click the "ADMIN" button.
Your browser should open up a new page at a URI path of /wp-login.php? which should be a WordPress login screen.
The username is admin
and the password is password
, secure right? We will change this but for now, it's on your local computer and I didn't want this to be too complicated.
You should now be logged in and see a screen like this:
How do I secure my WordPress website?
The first thing we are going to do is secure this thing. Head over to the "Users" option on the left menu (about half way down the page, also pictured above).
Click "add new"
Create a new Admin user - this will be a user for maintenance and general upkeep. You will not be using this user for writing blog posts. You cannot re-use emails, and we are going to create another "Author" role user for you to write articles with. As a good security practice, never use admin
or any version of it as a username. Emails as username are best.
Now that you have an admin user, you'll need to follow the same process to create another user but this time instead of Administrator rights, you'll want to make it an Author
. If you know anything about hashing tables, you'll never reuse a password again. Please, for the love of all that is holy, use a different password for the author than the admin.
This step is important because authors of the site should be allowed to write articles, not break the whole thing and your user/email may be embedded through out your site or in a sitemap - this makes a hacker's job easier if they can find it. So we create one they can find that, if they do gain access, it won't be to anything of value to them.
Now that you have a new admin user and author user, log out.
Now, log back in with your new admin user. Go back to the Users menu.
NOTE: The admin user owns a "lorem ipsum" post and All the pages/menus, if you delete it. You'll be stuck with an empty site. DONT DO THIS.
Select the "admin user" and in the bulk actions select "Delete" then "Apply".
This article so far only scratched a tiny subset of security for a WordPress site. Keep following along as we build this site up for more details.
Next...
I hope you enjoyed this first article on how to create a local portfolio - please keep an eye out for the next installation with Kaio Rosa as we go over this install process and how to edit pages and posts.
If you found this article helpful, give me a shout on twitter – I’d love to hear from you. @codingwithdrewk or connect with me on linkedin. As always, if you found any errors, just highlight it and mash that “R” button on the right side of the screen and I’ll get those fixed right up!
Drew is a seasoned DevOps Engineer with a rich background that spans multiple industries and technologies. With foundational training as a Nuclear Engineer in the US Navy, Drew brings a meticulous approach to operational efficiency and reliability. His expertise lies in cloud migration strategies, CI/CD automation, and Kubernetes orchestration. Known for a keen focus on facts and correctness, Drew is proficient in a range of programming languages including Bash and JavaScript. His diverse experiences, from serving in the military to working in the corporate world, have equipped him with a comprehensive worldview and a knack for creative problem-solving. Drew advocates for streamlined, fact-based approaches in both code and business, making him a reliable authority in the tech industry.