Start Your Developer Journey Building Your Portfolio - SETTING UP
SETTING UP
This is the first of a series of lessons to help you on your journey to being a developer without a computer science degree.
I found that, sometimes, developers get carried away with learning and working and rarely get the chance to build their porfolio. However, a portfolio is crucial for developers as it provides a way to showcase their skills, experience, and problem-solving abilities. Also, a porfolio serves as a marketing tool, a means of professional branding, and it opens doors to various opportunities in the industry.
We will start learning by building a professional portfolio. That way, we will have used one stone to kill two birds; learn and have a portfolio ready.
The lessons are expected to make the journey easier and, hopefully, fun.
The first series of the lessons will cover:
Basic HTML
Basic CSS
Responsiveness
Basic JavaScript
No Code build (Webflow)
Appreciation of the Web
We will be building a portfolio close to this. So let's get started!
1. Requirements
For this journey, you will need the following:
- A laptop
- Internet connection
- A browser on your laptop
- A can-do attitude
- At least one hour every weekday(try to hang out with loved ones on weekends)
2. Create Github Account
Git is a version control system. For now, we will say git will help us track our coding activities and progress and we will be using Github.
Visit https://github.com/ and click on signup to create an account.
(Since we are just starting out, we will not go into exlaining Git so we don't get overwhelmed.)
3. Set Up PC
3b. Install tools
Follow the instructions here to install git on your PC.
Also download and install VSCode.
Create a directory(folder) called onestitch on your PC where you want to store the codes from the lessons.
3b. Open Terminal
Open the folder with VSCode using the "open with ..." command in your file manager.
Click "Terminal" at the top of your VSCode interface and select "New Terminal"
At the bottom of your VSCode, you see a terminal.
We will be needing a terminal in most of the other steps.
4. Set Up Local And Remote Git Authentication
We will be using ssh(secure shell) keys to access github from our PC. ssh is a more secure way to access your account compared to username and password. You can use the terminal opened in step 3b.
Follow these directions to generate SSH keys.
Follow these to add the key to your github account.
Follow these to test the connection
5. Create Repository
Visit Github
Click the + at the top and select New repository
Type in repository name, my_portfolio.
Type in description, My Portfolio.
Select Public
Click create repository button to create repository
Copy the setup code provided by clicking the copy icon
6. Set Up Local Repository
Use the terminal opened in step 3b.
Inside the terminal, paste the setup code copied from github in the step above and hit enter.
mkdir my_portfolio
cd my_portfolio
echo "# my_portfolio" >> README.md
git init
git add README.md
git commit -m "first commit"
git branch -M main
git remote add origin git@github.com:{MY REPO}/my_portfolio.git
git push -u origin main
** Replace {MY REPO} with your github username
If you check your onestitch folder, you should find another folder called my_portfolio
ALWAYS SAVE
Whenever you make changes to your files, hit SAVE so that your changes will take effect.
When it looks like you cannot see the changes taking effect, go back to your file and hit SAVE again!
ADIEU!
With a successful setup, I can say that the hard part is over for now .
In the next lesson, we will start HTML Basics.
Until then, have fun!
RELATED POSTS
PREV <--------------------------------------------------------> NEXT