如何建立投资组合网站并将其托管在 GitHub 页面上？

在本文中，您将学习

• 如何建立自己的投资组合网站？
• 如何在 GitHub Pages 上免费托管您的网站？

你可以在你的简历上展示这个作品集。所以让我们开始吧！

下载作品集网站模板

我们将在网上寻找一些很棒的、响应迅速的投资组合设计模板，这些模板是免费的。 HTML5up (https://html5up.net/) 网站为个人作品集提供了许多不错的选择，其中包含许多专业转换和 CSS/Bootstrap 内容。

下面列出了模板的一些不错的选择：

• https://html5up.net/story
• https://html5up.net/solid-state
• https://html5up.net/miniport
• https://html5up.net/dimension

通过单击右上角的下载选项将模板下载为 ZIP。

相应地定制！

现在从 ZIP 中提取文件并仔细查看。您可能会看到“ images ”、“ assets ”等文件夹以及“ index.html ”、“ license.txt ”和“ readme.txt ”等文件。

• 删除license.txt和readme.txt文件。
• 在代码编辑器（例如VS Code或Sublime ）以及浏览器中打开index.html文件。
• 从代码编辑器开始对文本进行必要的更改，并通过刷新浏览器来反映更改。

您也可以通过更改图像文件夹中的图片来放置自己的图像和背景，但请记住放置与它相同的“文件名”。

完成并满意后，您可以更改 CSS 和样式。好吧，如果您是一个完整的新手，那完全是可选的。

用于编辑文件的 VS Code 编辑器

上传到 GitHub 存储库

最后，您的文件现在需要推送到新的 GitHub 存储库，并且必须使用GitHub Pages托管。要在 GitHub 中推送您的投资组合网站的必要文件，请按照给定的步骤操作：

• 登录 https://github.com/ 并单击存储库旁边左侧窗格中的新建选项。

点击新建选项

• 将存储库命名为“ your-username.github.io ”。 （例如，如果您的用户名是chandrikadeb7 ，则将存储库命名为chandrikadeb7.github.io ）。
• 单击创建存储库。

输入必要的详细信息，然后单击创建存储库

您可以通过两种方式从您的计算机上传所有必要的文件：

1. 使用浏览器内 GitHub 网站拖放/上传选项

• 单击新创建的存储库中的上传文件选项。
• 选择选项选择您的文件以从本地计算机上载它们。
• 或者只是在此屏幕上拖放文件夹。

上传必要的文件并单击 Commit Changes

2. 使用 Git 版本控制

• 您可以使用Git 版本控制系统将文件推送到您的存储库。
• 请参阅本指南以安装 Git https://git-scm.com/book/en/v2/Getting-Started-Installing-Git
• 将当前工作目录更改为您的本地项目。
• 将本地目录初始化为 Git 存储库。

$ git init

• 在新的本地存储库中添加文件。这会将它们分阶段进行第一次提交。

$ git add . 
 

# Adds the files in the local repository and stages them for commit. To unstage a file, use ‘git reset HEAD YOUR-FILE’. 
 

• 提交您在本地存储库中暂存的文件。

$ git commit -m “First commit” 
 

# Commits the tracked changes and prepares them to be pushed to a remote repository. To remove this commit and modify the file, use ‘git reset –soft HEAD~1’ and commit and add the file again. 
 

• 在 GitHub 存储库的快速设置页面顶部，单击剪贴板图标以复制远程存储库 URL。

单击剪贴板图标以复制 URL

• 在终端中，添加将推送本地存储库的远程存储库的 URL。

$ git remote add origin remote 
# Sets the new remote
$ git remote -v
# Verifies the new remote URL

• 将本地存储库中的更改推送到 GitHub。

$ git push -u origin master
# Pushes the changes in your local repository up to the remote repository you specified as the origin

使用 GitHub 页面托管

• 现在转到右上角的设置选项卡并向下滚动以查找GitHub Pages选项。
• 现在在 Source 下拉列表中选择master-branch ，将会看到一条通知，说明您已准备好在一两分钟内发布您的网站。

• 单击该通知超链接即可。您的作品集免费托管在 GitHub 页面上！

您的个人作品集网站发布在https://.github.io

你可以在这里看看我的——https://chandrikadeb7.github.io/