Loading...
「ツール」は右上に移動しました。
利用したサーバー: wtserver1
21いいね 606 views回再生

Build a Web Portfolio & Deploy It for Free with GitHub Pages

In this video, I will use a prebuilt static template, modify it and deploy it as a GitHub Page.

This video is for students building their own web portfolio for jobs, anyone who wants to showcase their technical skills and experiences in a consolidated manner, and lastly, those who are late to the game and don't want to spend a crazy amount of time building a site out from scratch and money for hosting (aka myself).

Project GitHub Repo:
https://github.com/SoftwareJournal/so...

PREREQUISITES FOR THIS PROJECT
A GitHub account (https://github.com/)
Git (https://git-scm.com/)
Text Editor of your choice - I used Visual Studio Code in this video (https://code.visualstudio.com/)

01:01 DOWNLOAD THE STATIC TEMPLATE
1. Download the static template files from this website: https://bit.ly/358KU40
2. You can place the zip file in any directory, I choose the Document/Web Project directory

02:53 PUT THE FILES ON THE REPO
3. Extract the zip files in any directory you want, I choose the Document/Web Project directory
4. Open the unzipped "developer - v2.5/developer - v2.5" folder
5. Copy all of the contents in the second "developer - v2.5" directory
6. Create a folder (name it anything), I'm naming mine softwarejournal.github.io in this video
7. Paste the contents in the created folder
8. Go to your GitHub account and create a repo
9. We're going to name the repo using the naming convention username.github.io in order to create our GitHub page; Since my username is a software journal put together mine has to be softwarejournal.github.io.
10. Keep the repo public and click the "create repository" button
11. Type "git init" on the command line
12. Next, type ' git commit -m "some_message_here" ' (for example, git commit -m "first commit")
13. Next, type "git branch -M main" on the command
14. Then, type this command on the command line: "git remote add origin https://github.com/your_username/your..." (for example, "git remote add origin https://github.com/SoftwareJournal/te...")
15. Finally, type this "git push -u origin main"

06:14 REVIEW YOUR SITE
16. Refresh your GitHub repo page
17. You should see the files from your computer on the site now
18. Next, go to "Settings" on the repo and Scroll down to the "GitHub Pages" section
19. Under Source, select the dropdown and select "main" as the source, and then, click save
20. Then, click the link where it says "Your site is published at:.... "
21. You should direct you to see the non-modified static template

07:41 MODIFY THE TEMPLATE
At this point, I modified the template outside of this video. I added my own content (images and text) to fill it up with my relevant information.

08:13 PUSH CHANGES TO REMOTE REPO
22. In the root directory of your repo, type "git add ."(don't forget the period/dot)
23. Next, type ' git commit -m "some_message_here" '.
24. Finally, type "git push"
25. If you're using the Chrome browser, click the "vertical ellipses", "More tools", and then, "Clear browsing data..."
26. Select only the "Cached images and files" checkbox and click the "Clear data" button
27. Go to your username.github.io site and you will see your changes!!!!

Let me know in the comments section if you're having troubles completing the steps, and I will be glad to help :) Happy Coding!

Like, Share and Subscribe, Peace!

#GithubPages #WebPortfolio #FreeHosting

コメント