diff --git a/.DS_Store b/.DS_Store deleted file mode 100644 index 479c2bd..0000000 Binary files a/.DS_Store and /dev/null differ diff --git a/404.html b/404.html index 6108419..fad37da 100644 --- a/404.html +++ b/404.html @@ -6,7 +6,7 @@ Page Not Found | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/assets/images/action-permissions-257697e4b90f46127e966cf28b037d6a.png b/assets/images/action-permissions-257697e4b90f46127e966cf28b037d6a.png new file mode 100644 index 0000000..65a2e53 Binary files /dev/null and b/assets/images/action-permissions-257697e4b90f46127e966cf28b037d6a.png differ diff --git a/assets/js/4053cadc.476ca6d7.js b/assets/js/4053cadc.476ca6d7.js new file mode 100644 index 0000000..4278d80 --- /dev/null +++ b/assets/js/4053cadc.476ca6d7.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunktechfolios=self.webpackChunktechfolios||[]).push([[1056],{3905:function(e,t,i){i.d(t,{Zo:function(){return p},kt:function(){return d}});var o=i(7294);function n(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function a(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,o)}return i}function r(e){for(var t=1;t=0||(n[i]=e[i]);return n}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(e,i)&&(n[i]=e[i])}return n}var l=o.createContext({}),c=function(e){var t=o.useContext(l),i=t;return e&&(i="function"==typeof e?e(t):r(r({},t),e)),i},p=function(e){var t=c(e.components);return o.createElement(l.Provider,{value:t},e.children)},u={inlineCode:"code",wrapper:function(e){var t=e.children;return o.createElement(o.Fragment,{},t)}},h=o.forwardRef((function(e,t){var i=e.components,n=e.mdxType,a=e.originalType,l=e.parentName,p=s(e,["components","mdxType","originalType","parentName"]),h=c(i),d=n,m=h["".concat(l,".").concat(d)]||h[d]||u[d]||a;return i?o.createElement(m,r(r({ref:t},p),{},{components:i})):o.createElement(m,r({ref:t},p))}));function d(e,t){var i=arguments,n=t&&t.mdxType;if("string"==typeof e||n){var a=i.length,r=new Array(a);r[0]=h;var s={};for(var l in t)hasOwnProperty.call(t,l)&&(s[l]=t[l]);s.originalType=e,s.mdxType="string"==typeof e?e:n,r[1]=s;for(var c=2;c_config.yml",id:"configure-_configyml",level:2},{value:"Monitor the build",id:"monitor-the-build",level:2},{value:"Set gh_pages",id:"set-gh_pages",level:2},{value:"View your portfolio",id:"view-your-portfolio",level:2}],h={toc:u};function d(e){var t=e.components,s=(0,n.Z)(e,r);return(0,a.kt)("wrapper",(0,o.Z)({},h,s,{components:t,mdxType:"MDXLayout"}),(0,a.kt)("p",null,"You only have to do the following initialization tasks when you are setting up your TechFolio for the very first time. "),(0,a.kt)("h2",{id:"join-github"},"Join GitHub"),(0,a.kt)("p",null,"To get started with TechFolios using this Quick Start, all you need is an account at GitHub. You don't need to download any software or even know how to use git. Everything you need to do for this Quick Start can be done in a browser."),(0,a.kt)("p",null,"If you haven't already, ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/signing-up-for-a-new-github-account"},"sign up for GitHub")," and ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/verifying-your-email-address/"},"verify your email address"),". Choose your username wisely, as that will become part of the URL to your portfolio site."),(0,a.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"Username recommendations")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},'Keep your username professional and close to your real name: "the3Gr8est" might seem super clever to you right now, but will be awkward and embarrassing to you during an interview next year. Restrict yourself to lowercase characters, numbers, and hyphens to make it simple to remember. Uppercase adds unnecessary confusion. Don\'t make your username location-specific: "philip-at-manoa" will be confusing if you move next year to San Francisco.'))),(0,a.kt)("p",null,"If you decide your current GitHub username could use some improvement, it is very easy to ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/changing-your-github-username/"},"change your GitHub username")," to something more professional."),(0,a.kt)("p",null,"Before proceeding, ",(0,a.kt)("a",{parentName:"p",href:"http://github.com/login"},"login")," to your GitHub account."),(0,a.kt)("h2",{id:"copy-the-template"},"Copy the template"),(0,a.kt)("p",null,"In this step, you'll make your personal copy of the TechFolio template."),(0,a.kt)("p",null,"First, go to ",(0,a.kt)("a",{parentName:"p",href:"https://github.com/techfolios/template"},"https://github.com/techfolios/template"),":"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6800).Z,width:"2482",height:"1436"})),(0,a.kt)("p",null,"Click the ",(0,a.kt)("inlineCode",{parentName:"p"},"Use this template"),' button. (If you don\'t see the "Use this template" button, make sure you are signed in to GitHub.) Select your account as the "Owner", and specify the repository name as your account name plus ".github.io". It should look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6665).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,"Then press the ",(0,a.kt)("inlineCode",{parentName:"p"},"Create repository from template")," button. GitHub will make a new copy of the template in your account and display a page like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(636).Z,width:"2232",height:"1906"})),(0,a.kt)("div",{className:"admonition admonition-warning alert alert--danger"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"Verify your repository name")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},'Make sure the repository name is correct. As you can see in this example, since my GitHub username is "philipmjohnson", the repository name must be "philipmjohnson.github.io". If the first part of the repository name does not match your GitHub username exactly, then you need to rename your repository right now to make it match. Click on the Settings link to rename your repo, it\'s easy to fix.'))),(0,a.kt)("p",null,'Now let\'s fix the "About" section to link to your portfolio. Click on the gear icon next to the "About" label, which brings up a dialog box. Add "Professional Portfolio" as the description, add "',(0,a.kt)("a",{parentName:"p",href:"https://USERNAME.github.io%22"},'https://USERNAME.github.io"'),' (where USERNAME is your username) as the website, and (if you want) add "professional-portfolio" as a topic. The result should look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6021).Z,width:"2372",height:"1762"})),(0,a.kt)("p",null,"After saving the changes, you'll have a convenient link to your professional portfolio on the home page for this repo."),(0,a.kt)("h2",{id:"set-workflow-permissions-to-read-and-write"},'Set workflow permissions to "Read and write"'),(0,a.kt)("p",null,"Now click on the Settings tab near the top of the window, then Actions and General in the left sidebar to display the Actions permissions page:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(5526).Z,width:"1200",height:"1384"})),(0,a.kt)("p",null,'Check that Workflow permissions is set to "Read and write permissions". If not, click the radio button and press "Save".'),(0,a.kt)("h2",{id:"configure-_configyml"},"Configure ",(0,a.kt)("inlineCode",{parentName:"h2"},"_config.yml")),(0,a.kt)("p",null,"Now that your repository is set up, we can start editing the template files to make this professional portfolio your own."),(0,a.kt)("p",null,'Scroll down the repository home page until you find the file named "_config.yml", and click on it, which will bring up a page that looks like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7193).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,"Click the pencil icon on the right hand side to edit the file:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(2935).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,'The first section of the file, "Required Changes", contains the three lines you have to change.\nEdit ',(0,a.kt)("inlineCode",{parentName:"p"},"title:")," to specify your own name, edit ",(0,a.kt)("inlineCode",{parentName:"p"},"url:")," to specify your portfolio, and edit ",(0,a.kt)("inlineCode",{parentName:"p"},"baseurl:")," to be the empty string. When you're done editing, that section of _config.yml should look similar to this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7486).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,'Scroll to the bottom of this page and click "Commit changes" to save these changes.'),(0,a.kt)("h2",{id:"monitor-the-build"},"Monitor the build"),(0,a.kt)("p",null,"Every time you commit a change to your portfolio, GitHub will attempt to build and deploy your revised portfolio. It does this through a technology called ",(0,a.kt)("a",{parentName:"p",href:"https://docs.github.com/en/actions"},"GitHub Actions"),". In fact, GitHub is trying to build a new version of your portfolio right now. Let's watch."),(0,a.kt)("p",null,'First, click on the "Actions" label on the home page of your repository. That will take you to a page that looks like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(2160).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,'This page indicates that two GitHub Actions (i.e. "workflows") named "pages-build-deployment" have previously run and completed successfully (indicated by the green checkmarks). There is a workflow called "Jekyll Deploy" that is running right now (indicated by the yellow dot). GitHub labels this workflow execution instance using the commit message associated with the change to the repository that triggered the Action. In this case, it was "Update _config.yml".'),(0,a.kt)("p",null,'You can watch the build in more detail by clicking on the "Update _config.yml" line, which takes you to a page like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(4646).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,'Clicking on the "build_and_deploy" label takes you to a page that shows the actual progress through the build:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(747).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,"Finally, you can click on the arrow next to any build step and see what happened during it:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(8395).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,"After a few minutes, the Jekyll Deploy workflow will complete and the Actions page will look like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7434).Z,width:"2426",height:"1856"})),(0,a.kt)("p",null,'Notice that there is a green checkmark beside the "Update _config.yml" workflow run, indicating that it has completed successfully.'),(0,a.kt)("div",{className:"admonition admonition-info alert alert--info"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"14",height:"16",viewBox:"0 0 14 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"}))),"Why monitor the build?")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},"There are two reasons it is useful to know how to monitor the build:"),(0,a.kt)("ol",{parentName:"div"},(0,a.kt)("li",{parentName:"ol"},"By monitoring the build, you'll know when your updated portfolio is ready to be viewed."),(0,a.kt)("li",{parentName:"ol"},"Monitoring the build lets you know if any errors occurred during the build.")),(0,a.kt)("p",{parentName:"div"},"Also, please note that the very first time you try to build your portfolio, it takes about five minutes, which is a long time! Don't worry, though: after this very first build, GitHub will cache the build artifacts and your future builds should take less than a minute to complete."))),(0,a.kt)("div",{className:"admonition admonition-warning alert alert--danger"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"Oh no! My very first build failed!")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},"Unfortunately, some users have reported that their first build failed with an error like this:"),(0,a.kt)("pre",{parentName:"div"},(0,a.kt)("code",{parentName:"pre"},"error: RPC failed; curl 55 Failed sending HTTP2 data\nfatal: the remote end hung up unexpectedly\nfatal: the remote end hung up unexpectedly\n")),(0,a.kt)("p",{parentName:"div"},"This is not your fault (or ours): it means that there was a network connection problem on GitHub's side that resulted in a timeout. In our experience, all you have to do is re-trigger the build one more time. (You can do this by editing the ",(0,a.kt)("inlineCode",{parentName:"p"},"_config.yml")," file and adding a space or newline, then committing the change). "),(0,a.kt)("p",{parentName:"div"},"The good news is that the files retrieved over the network for the first build are cached for the future, so it is unlikely you'll run into this particular error again upon subsequent builds of your portfolio."))),(0,a.kt)("h2",{id:"set-gh_pages"},"Set gh","_","pages"),(0,a.kt)("p",null,'The above build process has created a new branch in your repo called "gh_pages". Now you need to tell the GitHub Pages mechanism that this is where to look for your professional portfolio files. To do this, click on the "Settings" tab, and then on the "Pages" tab. This will take you to the following page:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(285).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Click on the button named "Branch: main", and select "gh-pages", then click "Save". The page should now look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9430).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Now click on the "Actions" tab and you\'ll notice that changing the branch from main to gh-pages has resulted in a new workflow run called "pages build and deployment":'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9488).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,"This run only took 36 seconds, so it completed by the time I switched to this tab. If you click on this workflow run, you'll see a page like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7878).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'As you can see, the "deploy" task provides a link to your professional portfolio.'),(0,a.kt)("h2",{id:"view-your-portfolio"},"View your portfolio"),(0,a.kt)("p",null,"Click the link to see your brand new professional portfolio:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9285).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Congratulations! The URL "',(0,a.kt)("a",{parentName:"p",href:"https://philipmjohnson.github.io%22"},'https://philipmjohnson.github.io"')," now shows the portfolio for... Molly Maluhia?"))}d.isMDXComponent=!0},6021:function(e,t,i){t.Z=i.p+"assets/images/about-dialog-4c316d9b8931182cbd3c4f80b9fc900b.png"},5526:function(e,t,i){t.Z=i.p+"assets/images/action-permissions-257697e4b90f46127e966cf28b037d6a.png"},2160:function(e,t,i){t.Z=i.p+"assets/images/actions-page-26102115676e6ca08648f369c15abce6.png"},4646:function(e,t,i){t.Z=i.p+"assets/images/actions-page2-61b4f6c4e261f76bdc2a8e6e9902d3c8.png"},747:function(e,t,i){t.Z=i.p+"assets/images/actions-page3-ad0c8102a1bd05f99f2c15492a4af758.png"},8395:function(e,t,i){t.Z=i.p+"assets/images/actions-page4-a3aa301956c2fb33989f7dede4f695f4.png"},7434:function(e,t,i){t.Z=i.p+"assets/images/actions-page6-0b8c0c3c795e35cdfe6f152c384cff65.png"},2935:function(e,t,i){t.Z=i.p+"assets/images/config-yml-edit1-323604dcc42fc4c5ffa9232c8aaa1813.png"},7486:function(e,t,i){t.Z=i.p+"assets/images/config-yml-edit2-58b8764ed69327452ae38ccaf01e9fc3.png"},7193:function(e,t,i){t.Z=i.p+"assets/images/config-yml-ce50af5f02e3bbb47f0d9a8426b1f466.png"},6665:function(e,t,i){t.Z=i.p+"assets/images/create-repository-8a65531ac29fb8efecef9dbeb4f9a9f5.png"},9285:function(e,t,i){t.Z=i.p+"assets/images/initial-portfolio-9580a327cbdc7f3ef3da26eed9351c07.png"},285:function(e,t,i){t.Z=i.p+"assets/images/pages-tab-49753c50df3addd3abb268c5c632cfa2.png"},9430:function(e,t,i){t.Z=i.p+"assets/images/pages-tab2-a5b25af22f152b5c8c2ae1003f40914d.png"},9488:function(e,t,i){t.Z=i.p+"assets/images/pages-workflow-run-1b5532e44c15a5faba29ec9a50459706.png"},7878:function(e,t,i){t.Z=i.p+"assets/images/pages-workflow-run2-b70183beaa93bdedb5d97e31f36b25ad.png"},636:function(e,t,i){t.Z=i.p+"assets/images/template-copy-173308700e9e58287b0f03ec69c836ce.png"},6800:function(e,t,i){t.Z=i.p+"assets/images/template-page-9371f1ec1dc932b87725b6c27b7b59a5.png"}}]); \ No newline at end of file diff --git a/assets/js/4053cadc.a830f53f.js b/assets/js/4053cadc.a830f53f.js deleted file mode 100644 index 9f7f513..0000000 --- a/assets/js/4053cadc.a830f53f.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunktechfolios=self.webpackChunktechfolios||[]).push([[1056],{3905:function(e,t,i){i.d(t,{Zo:function(){return u},kt:function(){return d}});var o=i(7294);function n(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function a(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),i.push.apply(i,o)}return i}function r(e){for(var t=1;t=0||(n[i]=e[i]);return n}(e,t);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(e,i)&&(n[i]=e[i])}return n}var s=o.createContext({}),c=function(e){var t=o.useContext(s),i=t;return e&&(i="function"==typeof e?e(t):r(r({},t),e)),i},u=function(e){var t=c(e.components);return o.createElement(s.Provider,{value:t},e.children)},p={inlineCode:"code",wrapper:function(e){var t=e.children;return o.createElement(o.Fragment,{},t)}},h=o.forwardRef((function(e,t){var i=e.components,n=e.mdxType,a=e.originalType,s=e.parentName,u=l(e,["components","mdxType","originalType","parentName"]),h=c(i),d=n,m=h["".concat(s,".").concat(d)]||h[d]||p[d]||a;return i?o.createElement(m,r(r({ref:t},u),{},{components:i})):o.createElement(m,r({ref:t},u))}));function d(e,t){var i=arguments,n=t&&t.mdxType;if("string"==typeof e||n){var a=i.length,r=new Array(a);r[0]=h;var l={};for(var s in t)hasOwnProperty.call(t,s)&&(l[s]=t[s]);l.originalType=e,l.mdxType="string"==typeof e?e:n,r[1]=l;for(var c=2;c_config.yml",id:"configure-_configyml",level:2},{value:"Monitor the build",id:"monitor-the-build",level:2},{value:"Set gh_pages",id:"set-gh_pages",level:2},{value:"View your portfolio",id:"view-your-portfolio",level:2}],h={toc:p};function d(e){var t=e.components,l=(0,n.Z)(e,r);return(0,a.kt)("wrapper",(0,o.Z)({},h,l,{components:t,mdxType:"MDXLayout"}),(0,a.kt)("p",null,"You only have to do the following initialization tasks when you are setting up your TechFolio for the very first time. "),(0,a.kt)("h2",{id:"join-github"},"Join GitHub"),(0,a.kt)("p",null,"To get started with TechFolios using this Quick Start, all you need is an account at GitHub. You don't need to download any software or even know how to use git. Everything you need to do for this Quick Start can be done in a browser."),(0,a.kt)("p",null,"If you haven't already, ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/signing-up-for-a-new-github-account"},"sign up for GitHub")," and ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/verifying-your-email-address/"},"verify your email address"),". Choose your username wisely, as that will become part of the URL to your portfolio site."),(0,a.kt)("div",{className:"admonition admonition-tip alert alert--success"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"}))),"Username recommendations")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},'Keep your username professional and close to your real name: "the3Gr8est" might seem super clever to you right now, but will be awkward and embarrassing to you during an interview next year. Restrict yourself to lowercase characters, numbers, and hyphens to make it simple to remember. Uppercase adds unnecessary confusion. Don\'t make your username location-specific: "philip-at-manoa" will be confusing if you move next year to San Francisco.'))),(0,a.kt)("p",null,"If you decide your current GitHub username could use some improvement, it is very easy to ",(0,a.kt)("a",{parentName:"p",href:"https://help.github.com/articles/changing-your-github-username/"},"change your GitHub username")," to something more professional."),(0,a.kt)("p",null,"Before proceeding, ",(0,a.kt)("a",{parentName:"p",href:"http://github.com/login"},"login")," to your GitHub account."),(0,a.kt)("h2",{id:"copy-the-template"},"Copy the template"),(0,a.kt)("p",null,"In this step, you'll make your personal copy of the TechFolio template."),(0,a.kt)("p",null,"First, go to ",(0,a.kt)("a",{parentName:"p",href:"https://github.com/techfolios/template"},"https://github.com/techfolios/template"),":"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6800).Z,width:"2482",height:"1436"})),(0,a.kt)("p",null,"Click the ",(0,a.kt)("inlineCode",{parentName:"p"},"Use this template"),' button. (If you don\'t see the "Use this template" button, make sure you are signed in to GitHub.) Select your account as the "Owner", and specify the repository name as your account name plus ".github.io". It should look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6665).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,"Then press the ",(0,a.kt)("inlineCode",{parentName:"p"},"Create repository from template")," button. GitHub will make a new copy of the template in your account and display a page like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(636).Z,width:"2232",height:"1906"})),(0,a.kt)("div",{className:"admonition admonition-warning alert alert--danger"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"Verify your repository name")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},'Make sure the repository name is correct. As you can see in this example, since my GitHub username is "philipmjohnson", the repository name must be "philipmjohnson.github.io". If the first part of the repository name does not match your GitHub username exactly, then you need to rename your repository right now to make it match. Click on the Settings link to rename your repo, it\'s easy to fix.'))),(0,a.kt)("p",null,'Now let\'s fix the "About" section to link to your portfolio. Click on the gear icon next to the "About" label, which brings up a dialog box. Add "Professional Portfolio" as the description, add "',(0,a.kt)("a",{parentName:"p",href:"https://USERNAME.github.io%22"},'https://USERNAME.github.io"'),' (where USERNAME is your username) as the website, and (if you want) add "professional-portfolio" as a topic. The result should look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(6021).Z,width:"2372",height:"1762"})),(0,a.kt)("p",null,"After saving the changes, you'll have a convenient link to your professional portfolio on the home page for this repo."),(0,a.kt)("h2",{id:"configure-_configyml"},"Configure ",(0,a.kt)("inlineCode",{parentName:"h2"},"_config.yml")),(0,a.kt)("p",null,"Now that your repository is set up, we can start editing the template files to make this professional portfolio your own."),(0,a.kt)("p",null,'Scroll down the repository home page until you find the file named "_config.yml", and click on it, which will bring up a page that looks like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7193).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,"Click the pencil icon on the right hand side to edit the file:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(2935).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,'The first section of the file, "Required Changes", contains the three lines you have to change.\nEdit ',(0,a.kt)("inlineCode",{parentName:"p"},"title:")," to specify your own name, edit ",(0,a.kt)("inlineCode",{parentName:"p"},"url:")," to specify your portfolio, and edit ",(0,a.kt)("inlineCode",{parentName:"p"},"baseurl:")," to be the empty string. When you're done editing, that section of _config.yml should look similar to this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7486).Z,width:"2260",height:"1738"})),(0,a.kt)("p",null,'Scroll to the bottom of this page and click "Commit changes" to save these changes.'),(0,a.kt)("h2",{id:"monitor-the-build"},"Monitor the build"),(0,a.kt)("p",null,"Every time you commit a change to your portfolio, GitHub will attempt to build and deploy your revised portfolio. It does this through a technology called ",(0,a.kt)("a",{parentName:"p",href:"https://docs.github.com/en/actions"},"GitHub Actions"),". In fact, GitHub is trying to build a new version of your portfolio right now. Let's watch."),(0,a.kt)("p",null,'First, click on the "Actions" label on the home page of your repository. That will take you to a page that looks like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(2160).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,'This page indicates that two GitHub Actions (i.e. "workflows") named "pages-build-deployment" have previously run and completed successfully (indicated by the green checkmarks). There is a workflow called "Jekyll Deploy" that is running right now (indicated by the yellow dot). GitHub labels this workflow execution instance using the commit message associated with the change to the repository that triggered the Action. In this case, it was "Update _config.yml".'),(0,a.kt)("p",null,'You can watch the build in more detail by clicking on the "Update _config.yml" line, which takes you to a page like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(4646).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,'Clicking on the "build_and_deploy" label takes you to a page that shows the actual progress through the build:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(747).Z,width:"2426",height:"1964"})),(0,a.kt)("p",null,"Finally, you can click on the arrow next to any build step and see what happened during it:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(8395).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,"After a few minutes, the Jekyll Deploy workflow will complete and the Actions page will look like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7434).Z,width:"2426",height:"1856"})),(0,a.kt)("p",null,'Notice that there is a green checkmark beside the "Update _config.yml" workflow run, indicating that it has completed successfully.'),(0,a.kt)("div",{className:"admonition admonition-info alert alert--info"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"14",height:"16",viewBox:"0 0 14 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"}))),"Why monitor the build?")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},"There are two reasons it is useful to know how to monitor the build:"),(0,a.kt)("ol",{parentName:"div"},(0,a.kt)("li",{parentName:"ol"},"By monitoring the build, you'll know when your updated portfolio is ready to be viewed."),(0,a.kt)("li",{parentName:"ol"},"Monitoring the build lets you know if any errors occurred during the build.")),(0,a.kt)("p",{parentName:"div"},"Also, please note that the very first time you try to build your portfolio, it takes about five minutes, which is a long time! Don't worry, though: after this very first build, GitHub will cache the build artifacts and your future builds should take less than a minute to complete."))),(0,a.kt)("div",{className:"admonition admonition-warning alert alert--danger"},(0,a.kt)("div",{parentName:"div",className:"admonition-heading"},(0,a.kt)("h5",{parentName:"div"},(0,a.kt)("span",{parentName:"h5",className:"admonition-icon"},(0,a.kt)("svg",{parentName:"span",xmlns:"http://www.w3.org/2000/svg",width:"12",height:"16",viewBox:"0 0 12 16"},(0,a.kt)("path",{parentName:"svg",fillRule:"evenodd",d:"M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"}))),"Oh no! My very first build failed!")),(0,a.kt)("div",{parentName:"div",className:"admonition-content"},(0,a.kt)("p",{parentName:"div"},"Unfortunately, some users have reported that their first build failed with an error like this:"),(0,a.kt)("pre",{parentName:"div"},(0,a.kt)("code",{parentName:"pre"},"error: RPC failed; curl 55 Failed sending HTTP2 data\nfatal: the remote end hung up unexpectedly\nfatal: the remote end hung up unexpectedly\n")),(0,a.kt)("p",{parentName:"div"},"This is not your fault (or ours): it means that there was a network connection problem on GitHub's side that resulted in a timeout. In our experience, all you have to do is re-trigger the build one more time. (You can do this by editing the ",(0,a.kt)("inlineCode",{parentName:"p"},"_config.yml")," file and adding a space or newline, then committing the change). "),(0,a.kt)("p",{parentName:"div"},"The good news is that the files retrieved over the network for the first build are cached for the future, so it is unlikely you'll run into this particular error again upon subsequent builds of your portfolio."))),(0,a.kt)("h2",{id:"set-gh_pages"},"Set gh","_","pages"),(0,a.kt)("p",null,'The above build process has created a new branch in your repo called "gh_pages". Now you need to tell the GitHub Pages mechanism that this is where to look for your professional portfolio files. To do this, click on the "Settings" tab, and then on the "Pages" tab. This will take you to the following page:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(285).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Click on the button named "Branch: main", and select "gh-pages", then click "Save". The page should now look like this:'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9430).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Now click on the "Actions" tab and you\'ll notice that changing the branch from main to gh-pages has resulted in a new workflow run called "pages build and deployment":'),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9488).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,"This run only took 36 seconds, so it completed by the time I switched to this tab. If you click on this workflow run, you'll see a page like this:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(7878).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'As you can see, the "deploy" task provides a link to your professional portfolio.'),(0,a.kt)("h2",{id:"view-your-portfolio"},"View your portfolio"),(0,a.kt)("p",null,"Click the link to see your brand new professional portfolio:"),(0,a.kt)("p",null,(0,a.kt)("img",{src:i(9285).Z,width:"2232",height:"1906"})),(0,a.kt)("p",null,'Congratulations! The URL "',(0,a.kt)("a",{parentName:"p",href:"https://philipmjohnson.github.io%22"},'https://philipmjohnson.github.io"')," now shows the portfolio for... Molly Maluhia?"))}d.isMDXComponent=!0},6021:function(e,t,i){t.Z=i.p+"assets/images/about-dialog-4c316d9b8931182cbd3c4f80b9fc900b.png"},2160:function(e,t,i){t.Z=i.p+"assets/images/actions-page-26102115676e6ca08648f369c15abce6.png"},4646:function(e,t,i){t.Z=i.p+"assets/images/actions-page2-61b4f6c4e261f76bdc2a8e6e9902d3c8.png"},747:function(e,t,i){t.Z=i.p+"assets/images/actions-page3-ad0c8102a1bd05f99f2c15492a4af758.png"},8395:function(e,t,i){t.Z=i.p+"assets/images/actions-page4-a3aa301956c2fb33989f7dede4f695f4.png"},7434:function(e,t,i){t.Z=i.p+"assets/images/actions-page6-0b8c0c3c795e35cdfe6f152c384cff65.png"},2935:function(e,t,i){t.Z=i.p+"assets/images/config-yml-edit1-323604dcc42fc4c5ffa9232c8aaa1813.png"},7486:function(e,t,i){t.Z=i.p+"assets/images/config-yml-edit2-58b8764ed69327452ae38ccaf01e9fc3.png"},7193:function(e,t,i){t.Z=i.p+"assets/images/config-yml-ce50af5f02e3bbb47f0d9a8426b1f466.png"},6665:function(e,t,i){t.Z=i.p+"assets/images/create-repository-8a65531ac29fb8efecef9dbeb4f9a9f5.png"},9285:function(e,t,i){t.Z=i.p+"assets/images/initial-portfolio-9580a327cbdc7f3ef3da26eed9351c07.png"},285:function(e,t,i){t.Z=i.p+"assets/images/pages-tab-49753c50df3addd3abb268c5c632cfa2.png"},9430:function(e,t,i){t.Z=i.p+"assets/images/pages-tab2-a5b25af22f152b5c8c2ae1003f40914d.png"},9488:function(e,t,i){t.Z=i.p+"assets/images/pages-workflow-run-1b5532e44c15a5faba29ec9a50459706.png"},7878:function(e,t,i){t.Z=i.p+"assets/images/pages-workflow-run2-b70183beaa93bdedb5d97e31f36b25ad.png"},636:function(e,t,i){t.Z=i.p+"assets/images/template-copy-173308700e9e58287b0f03ec69c836ce.png"},6800:function(e,t,i){t.Z=i.p+"assets/images/template-page-9371f1ec1dc932b87725b6c27b7b59a5.png"}}]); \ No newline at end of file diff --git a/assets/js/44963dd1.5ea0435e.js b/assets/js/44963dd1.1d7e0b02.js similarity index 87% rename from assets/js/44963dd1.5ea0435e.js rename to assets/js/44963dd1.1d7e0b02.js index 6122838..375761a 100644 --- a/assets/js/44963dd1.5ea0435e.js +++ b/assets/js/44963dd1.1d7e0b02.js @@ -1 +1 @@ -"use strict";(self.webpackChunktechfolios=self.webpackChunktechfolios||[]).push([[3142],{3905:function(e,t,n){n.d(t,{Zo:function(){return c},kt:function(){return y}});var o=n(7294);function r(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function l(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function a(e){for(var t=1;t=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}var s=o.createContext({}),u=function(e){var t=o.useContext(s),n=t;return e&&(n="function"==typeof e?e(t):a(a({},t),e)),n},c=function(e){var t=u(e.components);return o.createElement(s.Provider,{value:t},e.children)},p={inlineCode:"code",wrapper:function(e){var t=e.children;return o.createElement(o.Fragment,{},t)}},d=o.forwardRef((function(e,t){var n=e.components,r=e.mdxType,l=e.originalType,s=e.parentName,c=i(e,["components","mdxType","originalType","parentName"]),d=u(n),y=r,f=d["".concat(s,".").concat(y)]||d[y]||p[y]||l;return n?o.createElement(f,a(a({ref:t},c),{},{components:n})):o.createElement(f,a({ref:t},c))}));function y(e,t){var n=arguments,r=t&&t.mdxType;if("string"==typeof e||r){var l=n.length,a=new Array(l);a[0]=d;var i={};for(var s in t)hasOwnProperty.call(t,s)&&(i[s]=t[s]);i.originalType=e,i.mdxType="string"==typeof e?e:r,a[1]=i;for(var u=2;u=0||(r[n]=e[n]);return r}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(o=0;o=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(r[n]=e[n])}return r}var s=o.createContext({}),u=function(e){var t=o.useContext(s),n=t;return e&&(n="function"==typeof e?e(t):a(a({},t),e)),n},c=function(e){var t=u(e.components);return o.createElement(s.Provider,{value:t},e.children)},p={inlineCode:"code",wrapper:function(e){var t=e.children;return o.createElement(o.Fragment,{},t)}},d=o.forwardRef((function(e,t){var n=e.components,r=e.mdxType,l=e.originalType,s=e.parentName,c=i(e,["components","mdxType","originalType","parentName"]),d=u(n),y=r,f=d["".concat(s,".").concat(y)]||d[y]||p[y]||l;return n?o.createElement(f,a(a({ref:t},c),{},{components:n})):o.createElement(f,a({ref:t},c))}));function y(e,t){var n=arguments,r=t&&t.mdxType;if("string"==typeof e||r){var l=n.length,a=new Array(l);a[0]=d;var i={};for(var s in t)hasOwnProperty.call(t,s)&&(i[s]=t[s]);i.originalType=e,i.mdxType="string"==typeof e?e:r,a[1]=i;for(var u=2;u=a)&&Object.keys(r.O).every((function(e){return r.O[e](f[o])}))?f.splice(o--,1):(n=!1,a0&&e[u-1][2]>a;u--)e[u]=e[u-1];e[u]=[f,t,a]},r.n=function(e){var c=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(c,{a:c}),c},f=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},r.t=function(e,t){if(1&t&&(e=this(e)),8&t)return e;if("object"==typeof e&&e){if(4&t&&e.__esModule)return e;if(16&t&&"function"==typeof e.then)return e}var a=Object.create(null);r.r(a);var d={};c=c||[null,f({}),f([]),f(f)];for(var n=2&t&&e;"object"==typeof n&&!~c.indexOf(n);n=f(n))Object.getOwnPropertyNames(n).forEach((function(c){d[c]=function(){return e[c]}}));return d.default=function(){return e},r.d(a,d),a},r.d=function(e,c){for(var f in c)r.o(c,f)&&!r.o(e,f)&&Object.defineProperty(e,f,{enumerable:!0,get:c[f]})},r.f={},r.e=function(e){return Promise.all(Object.keys(r.f).reduce((function(c,f){return r.f[f](e,c),c}),[]))},r.u=function(e){return"assets/js/"+({53:"935f2afb",193:"1e31dc8e",205:"83d480e9",533:"b2b675dd",640:"5b290cac",690:"4b10f861",896:"1529e9c7",1056:"4053cadc",1238:"e86c6eaa",1372:"1db64337",1477:"b2f554cd",1585:"2450005c",1610:"01f1ab6a",1713:"a7023ddc",2146:"989ed936",2535:"814f3328",2736:"4464097e",2749:"d3def08a",2968:"a868d790",3025:"d77c3a9d",3030:"d6e9d8e2",3085:"1f391b9e",3089:"a6aa9e1f",3142:"44963dd1",3519:"f2930f15",3608:"9e4087bc",3737:"8da93d40",3753:"d06e7865",3859:"829ad76c",3981:"2f68f199",4013:"01a85c17",4195:"c4f5d8e4",4241:"32c9e580",4251:"eb8f7973",4310:"4f8daff2",4325:"f73d6f26",4451:"5fef6e31",4643:"ce6b2e59",4777:"def4c1b1",5091:"14dea474",5320:"e04645d7",5815:"4c7649fb",5826:"49491008",6103:"ccc49370",6185:"0a684d14",6214:"31368eba",6709:"c9334f31",6756:"6a1b1137",6828:"ac604baa",7031:"304a9b6f",7140:"ccb61812",7142:"cce2c3d3",7275:"6658404a",7414:"393be207",7438:"9c021584",7542:"3e6f14ef",7558:"960b39d2",7786:"383039d6",7874:"5a53baa4",7918:"17896441",7990:"e6691236",8511:"a9309055",8520:"98335cfd",8591:"ee9b4564",8593:"f0ab6f9e",8610:"6875c492",8993:"bce1e54f",9106:"666f490c",9379:"8c9540e9",9453:"3c72ff1d",9514:"1be78505",9866:"50bef4b9",9892:"5ce72743"}[e]||e)+"."+{53:"e92c5f9f",193:"01925d29",205:"6309c164",533:"bf426f68",640:"edf3ad1d",690:"7fae1ea3",896:"5a39d896",1056:"a830f53f",1238:"02f8051c",1372:"7052b2a1",1465:"e33c3922",1477:"290be38f",1585:"69296719",1610:"2b1d6a31",1713:"c2b0ddf9",2146:"76869abf",2535:"195baba4",2736:"60ffb405",2749:"d03087ad",2968:"43424767",3025:"d2492fa6",3030:"6d583aa7",3085:"de5a7767",3089:"862cb02f",3142:"5ea0435e",3519:"370ac349",3608:"ca90e0c4",3737:"731575cc",3753:"310c5913",3859:"b9385461",3981:"5babd116",4013:"318b36c1",4195:"823b1d4a",4241:"8e2b65c9",4251:"b1ff6462",4310:"0e26ae0d",4325:"08274196",4451:"2a4c0075",4608:"5111dffc",4643:"6bf91ed1",4777:"bbbae7be",5091:"37f99562",5290:"7da35cb9",5320:"63445d71",5815:"ab7192d0",5826:"7fcbf783",6103:"54319be2",6185:"73daced7",6214:"21f557d6",6709:"500ec07a",6756:"18f989f8",6828:"6ea87133",7031:"0e5a7fd3",7140:"4f6d281a",7142:"9b9f460d",7275:"d766c837",7414:"b85e8144",7438:"17c5d39c",7542:"e755b817",7558:"1913dca9",7786:"6f0f0fdc",7874:"3816fc45",7918:"2f56af7d",7990:"f5a259c5",8511:"93608a0a",8520:"1f143054",8591:"1ff7497d",8593:"ec2c50a2",8610:"437bb4fd",8993:"ae5d6966",9106:"c0702b88",9379:"124bc6ec",9453:"2e025042",9514:"f254f197",9866:"573417f6",9892:"7c49e989"}[e]+".js"},r.miniCssF=function(e){},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=function(e,c){return Object.prototype.hasOwnProperty.call(e,c)},t={},a="techfolios:",r.l=function(e,c,f,d){if(t[e])t[e].push(c);else{var n,o;if(void 0!==f)for(var b=document.getElementsByTagName("script"),u=0;u=a)&&Object.keys(r.O).every((function(e){return r.O[e](f[o])}))?f.splice(o--,1):(n=!1,a0&&e[u-1][2]>a;u--)e[u]=e[u-1];e[u]=[f,t,a]},r.n=function(e){var c=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(c,{a:c}),c},f=Object.getPrototypeOf?function(e){return Object.getPrototypeOf(e)}:function(e){return e.__proto__},r.t=function(e,t){if(1&t&&(e=this(e)),8&t)return e;if("object"==typeof e&&e){if(4&t&&e.__esModule)return e;if(16&t&&"function"==typeof e.then)return e}var a=Object.create(null);r.r(a);var d={};c=c||[null,f({}),f([]),f(f)];for(var n=2&t&&e;"object"==typeof n&&!~c.indexOf(n);n=f(n))Object.getOwnPropertyNames(n).forEach((function(c){d[c]=function(){return e[c]}}));return d.default=function(){return e},r.d(a,d),a},r.d=function(e,c){for(var f in c)r.o(c,f)&&!r.o(e,f)&&Object.defineProperty(e,f,{enumerable:!0,get:c[f]})},r.f={},r.e=function(e){return Promise.all(Object.keys(r.f).reduce((function(c,f){return r.f[f](e,c),c}),[]))},r.u=function(e){return"assets/js/"+({53:"935f2afb",193:"1e31dc8e",205:"83d480e9",533:"b2b675dd",640:"5b290cac",690:"4b10f861",896:"1529e9c7",1056:"4053cadc",1238:"e86c6eaa",1372:"1db64337",1477:"b2f554cd",1585:"2450005c",1610:"01f1ab6a",1713:"a7023ddc",2146:"989ed936",2535:"814f3328",2736:"4464097e",2749:"d3def08a",2968:"a868d790",3025:"d77c3a9d",3030:"d6e9d8e2",3085:"1f391b9e",3089:"a6aa9e1f",3142:"44963dd1",3519:"f2930f15",3608:"9e4087bc",3737:"8da93d40",3753:"d06e7865",3859:"829ad76c",3981:"2f68f199",4013:"01a85c17",4195:"c4f5d8e4",4241:"32c9e580",4251:"eb8f7973",4310:"4f8daff2",4325:"f73d6f26",4451:"5fef6e31",4643:"ce6b2e59",4777:"def4c1b1",5091:"14dea474",5320:"e04645d7",5815:"4c7649fb",5826:"49491008",6103:"ccc49370",6185:"0a684d14",6214:"31368eba",6709:"c9334f31",6756:"6a1b1137",6828:"ac604baa",7031:"304a9b6f",7140:"ccb61812",7142:"cce2c3d3",7275:"6658404a",7414:"393be207",7438:"9c021584",7542:"3e6f14ef",7558:"960b39d2",7786:"383039d6",7874:"5a53baa4",7918:"17896441",7990:"e6691236",8511:"a9309055",8520:"98335cfd",8591:"ee9b4564",8593:"f0ab6f9e",8610:"6875c492",8993:"bce1e54f",9106:"666f490c",9379:"8c9540e9",9453:"3c72ff1d",9514:"1be78505",9866:"50bef4b9",9892:"5ce72743"}[e]||e)+"."+{53:"e92c5f9f",193:"01925d29",205:"6309c164",533:"bf426f68",640:"edf3ad1d",690:"7fae1ea3",896:"5a39d896",1056:"476ca6d7",1238:"02f8051c",1372:"7052b2a1",1465:"e33c3922",1477:"290be38f",1585:"69296719",1610:"2b1d6a31",1713:"c2b0ddf9",2146:"76869abf",2535:"195baba4",2736:"60ffb405",2749:"d03087ad",2968:"43424767",3025:"d2492fa6",3030:"6d583aa7",3085:"de5a7767",3089:"862cb02f",3142:"1d7e0b02",3519:"370ac349",3608:"ca90e0c4",3737:"731575cc",3753:"310c5913",3859:"b9385461",3981:"5babd116",4013:"318b36c1",4195:"823b1d4a",4241:"8e2b65c9",4251:"b1ff6462",4310:"0e26ae0d",4325:"08274196",4451:"2a4c0075",4608:"5111dffc",4643:"6bf91ed1",4777:"bbbae7be",5091:"37f99562",5290:"7da35cb9",5320:"63445d71",5815:"ab7192d0",5826:"7fcbf783",6103:"54319be2",6185:"73daced7",6214:"21f557d6",6709:"500ec07a",6756:"18f989f8",6828:"6ea87133",7031:"0e5a7fd3",7140:"4f6d281a",7142:"9b9f460d",7275:"d766c837",7414:"b85e8144",7438:"17c5d39c",7542:"e755b817",7558:"1913dca9",7786:"6f0f0fdc",7874:"3816fc45",7918:"2f56af7d",7990:"f5a259c5",8511:"93608a0a",8520:"1f143054",8591:"1ff7497d",8593:"ec2c50a2",8610:"437bb4fd",8993:"ae5d6966",9106:"c0702b88",9379:"124bc6ec",9453:"2e025042",9514:"f254f197",9866:"573417f6",9892:"7c49e989"}[e]+".js"},r.miniCssF=function(e){},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=function(e,c){return Object.prototype.hasOwnProperty.call(e,c)},t={},a="techfolios:",r.l=function(e,c,f,d){if(t[e])t[e].push(c);else{var n,o;if(void 0!==f)for(var b=document.getElementsByTagName("script"),u=0;u Blog | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/2022/06/13/techfolios-2.html b/blog/2022/06/13/techfolios-2.html index 2fac0f2..962446d 100644 --- a/blog/2022/06/13/techfolios-2.html +++ b/blog/2022/06/13/techfolios-2.html @@ -6,7 +6,7 @@ TechFolios 2 | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/archive.html b/blog/archive.html index ea9e198..d549b3c 100644 --- a/blog/archive.html +++ b/blog/archive.html @@ -6,7 +6,7 @@ Archive | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/fullstack-presentation.html b/blog/fullstack-presentation.html index acb68f9..cc01758 100644 --- a/blog/fullstack-presentation.html +++ b/blog/fullstack-presentation.html @@ -6,7 +6,7 @@ Techfolios at FullStack Honolulu | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/ics-portfolios.html b/blog/ics-portfolios.html index af0687e..5ddd5d5 100644 --- a/blog/ics-portfolios.html +++ b/blog/ics-portfolios.html @@ -6,7 +6,7 @@ ICS Portfolios | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/initial-release.html b/blog/initial-release.html index b2153ea..20bc869 100644 --- a/blog/initial-release.html +++ b/blog/initial-release.html @@ -6,7 +6,7 @@ Initial Release | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/preview-release.html b/blog/preview-release.html index 6dfb983..cc3fa8e 100644 --- a/blog/preview-release.html +++ b/blog/preview-release.html @@ -6,7 +6,7 @@ Preview Release | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/release-1-1.html b/blog/release-1-1.html index d34239c..d9d6f6b 100644 --- a/blog/release-1-1.html +++ b/blog/release-1-1.html @@ -6,7 +6,7 @@ Release 1.1 | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/syntax-highlighting-fix.html b/blog/syntax-highlighting-fix.html index 0cb7e38..c485908 100644 --- a/blog/syntax-highlighting-fix.html +++ b/blog/syntax-highlighting-fix.html @@ -6,7 +6,7 @@ Syntax highlighting fix | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/tags.html b/blog/tags.html index 07ba178..1c5f387 100644 --- a/blog/tags.html +++ b/blog/tags.html @@ -6,7 +6,7 @@ Tags | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/tags/bug.html b/blog/tags/bug.html index e536d36..c47c5f9 100644 --- a/blog/tags/bug.html +++ b/blog/tags/bug.html @@ -6,7 +6,7 @@ One post tagged with "bug" | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/tags/presentation.html b/blog/tags/presentation.html index a6ef9e9..4f19fe5 100644 --- a/blog/tags/presentation.html +++ b/blog/tags/presentation.html @@ -6,7 +6,7 @@ One post tagged with "presentation" | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/tags/release.html b/blog/tags/release.html index 4b522c7..edc2159 100644 --- a/blog/tags/release.html +++ b/blog/tags/release.html @@ -6,7 +6,7 @@ 6 posts tagged with "release" | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/tags/workshop.html b/blog/tags/workshop.html index 546e40e..5993343 100644 --- a/blog/tags/workshop.html +++ b/blog/tags/workshop.html @@ -6,7 +6,7 @@ One post tagged with "workshop" | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/techfolio-designer.html b/blog/techfolio-designer.html index ef51372..4b1f748 100644 --- a/blog/techfolio-designer.html +++ b/blog/techfolio-designer.html @@ -6,7 +6,7 @@ Techfolio Designer | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/blog/workshops-2016.html b/blog/workshops-2016.html index a60845f..8956b9a 100644 --- a/blog/workshops-2016.html +++ b/blog/workshops-2016.html @@ -6,7 +6,7 @@ TechFolio Workshops | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/archive/developer-guide/manage-this-site.html b/docs/archive/developer-guide/manage-this-site.html index d1b8b33..830455b 100644 --- a/docs/archive/developer-guide/manage-this-site.html +++ b/docs/archive/developer-guide/manage-this-site.html @@ -6,7 +6,7 @@ Manage this site | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/archive/developer-guide/markdown-features.html b/docs/archive/developer-guide/markdown-features.html index 6dec594..7a405c2 100644 --- a/docs/archive/developer-guide/markdown-features.html +++ b/docs/archive/developer-guide/markdown-features.html @@ -6,7 +6,7 @@ Markdown Features | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/archive/developer-guide/overview.html b/docs/archive/developer-guide/overview.html index d6f7cdc..50bb794 100644 --- a/docs/archive/developer-guide/overview.html +++ b/docs/archive/developer-guide/overview.html @@ -6,7 +6,7 @@ Overview | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/archive/developer-guide/theme-customization.html b/docs/archive/developer-guide/theme-customization.html index 58a6cf4..66e5c16 100644 --- a/docs/archive/developer-guide/theme-customization.html +++ b/docs/archive/developer-guide/theme-customization.html @@ -6,7 +6,7 @@ Customizing Morea themes | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/gallery.html b/docs/gallery.html index c7b215b..9a062d4 100644 --- a/docs/gallery.html +++ b/docs/gallery.html @@ -6,7 +6,7 @@ Gallery | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/help.html b/docs/help.html index 821ae3c..e71950e 100644 --- a/docs/help.html +++ b/docs/help.html @@ -6,7 +6,7 @@ Help | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/overview.html b/docs/overview.html index c966eda..f9da205 100644 --- a/docs/overview.html +++ b/docs/overview.html @@ -6,7 +6,7 @@ Overview | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/configure-bio-json.html b/docs/quick-start/configure-bio-json.html index 6b7dc00..03098ba 100644 --- a/docs/quick-start/configure-bio-json.html +++ b/docs/quick-start/configure-bio-json.html @@ -6,7 +6,7 @@ Configure bio.json | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/configure-essays.html b/docs/quick-start/configure-essays.html index eda2ccb..2d306a4 100644 --- a/docs/quick-start/configure-essays.html +++ b/docs/quick-start/configure-essays.html @@ -6,7 +6,7 @@ Configure essays | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/configure-projects.html b/docs/quick-start/configure-projects.html index b385b57..6a0a3dc 100644 --- a/docs/quick-start/configure-projects.html +++ b/docs/quick-start/configure-projects.html @@ -6,7 +6,7 @@ Configure projects | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/configure-resume.html b/docs/quick-start/configure-resume.html index 8c14ac7..7fa6283 100644 --- a/docs/quick-start/configure-resume.html +++ b/docs/quick-start/configure-resume.html @@ -6,7 +6,7 @@ Configure resume | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/configure-theme.html b/docs/quick-start/configure-theme.html index eed625b..6a1a279 100644 --- a/docs/quick-start/configure-theme.html +++ b/docs/quick-start/configure-theme.html @@ -6,7 +6,7 @@ Configure theme | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/quick-start/initialization.html b/docs/quick-start/initialization.html index a62380c..5c0192e 100644 --- a/docs/quick-start/initialization.html +++ b/docs/quick-start/initialization.html @@ -6,17 +6,17 @@ Initialization | TechFolios - +
-

Initialization

You only have to do the following initialization tasks when you are setting up your TechFolio for the very first time.

Join GitHub​

To get started with TechFolios using this Quick Start, all you need is an account at GitHub. You don't need to download any software or even know how to use git. Everything you need to do for this Quick Start can be done in a browser.

If you haven't already, sign up for GitHub and verify your email address. Choose your username wisely, as that will become part of the URL to your portfolio site.

Username recommendations

Keep your username professional and close to your real name: "the3Gr8est" might seem super clever to you right now, but will be awkward and embarrassing to you during an interview next year. Restrict yourself to lowercase characters, numbers, and hyphens to make it simple to remember. Uppercase adds unnecessary confusion. Don't make your username location-specific: "philip-at-manoa" will be confusing if you move next year to San Francisco.

If you decide your current GitHub username could use some improvement, it is very easy to change your GitHub username to something more professional.

Before proceeding, login to your GitHub account.

Copy the template​

In this step, you'll make your personal copy of the TechFolio template.

First, go to https://github.com/techfolios/template:

Click the Use this template button. (If you don't see the "Use this template" button, make sure you are signed in to GitHub.) Select your account as the "Owner", and specify the repository name as your account name plus ".github.io". It should look like this:

Then press the Create repository from template button. GitHub will make a new copy of the template in your account and display a page like this:

Verify your repository name

Make sure the repository name is correct. As you can see in this example, since my GitHub username is "philipmjohnson", the repository name must be "philipmjohnson.github.io". If the first part of the repository name does not match your GitHub username exactly, then you need to rename your repository right now to make it match. Click on the Settings link to rename your repo, it's easy to fix.

Now let's fix the "About" section to link to your portfolio. Click on the gear icon next to the "About" label, which brings up a dialog box. Add "Professional Portfolio" as the description, add "https://USERNAME.github.io" (where USERNAME is your username) as the website, and (if you want) add "professional-portfolio" as a topic. The result should look like this:

After saving the changes, you'll have a convenient link to your professional portfolio on the home page for this repo.

Configure _config.yml​

Now that your repository is set up, we can start editing the template files to make this professional portfolio your own.

Scroll down the repository home page until you find the file named "_config.yml", and click on it, which will bring up a page that looks like this:

Click the pencil icon on the right hand side to edit the file:

The first section of the file, "Required Changes", contains the three lines you have to change. -Edit title: to specify your own name, edit url: to specify your portfolio, and edit baseurl: to be the empty string. When you're done editing, that section of _config.yml should look similar to this:

Scroll to the bottom of this page and click "Commit changes" to save these changes.

Monitor the build​

Every time you commit a change to your portfolio, GitHub will attempt to build and deploy your revised portfolio. It does this through a technology called GitHub Actions. In fact, GitHub is trying to build a new version of your portfolio right now. Let's watch.

First, click on the "Actions" label on the home page of your repository. That will take you to a page that looks like this:

This page indicates that two GitHub Actions (i.e. "workflows") named "pages-build-deployment" have previously run and completed successfully (indicated by the green checkmarks). There is a workflow called "Jekyll Deploy" that is running right now (indicated by the yellow dot). GitHub labels this workflow execution instance using the commit message associated with the change to the repository that triggered the Action. In this case, it was "Update _config.yml".

You can watch the build in more detail by clicking on the "Update _config.yml" line, which takes you to a page like this:

Clicking on the "build_and_deploy" label takes you to a page that shows the actual progress through the build:

Finally, you can click on the arrow next to any build step and see what happened during it:

After a few minutes, the Jekyll Deploy workflow will complete and the Actions page will look like this:

Notice that there is a green checkmark beside the "Update _config.yml" workflow run, indicating that it has completed successfully.

Why monitor the build?

There are two reasons it is useful to know how to monitor the build:

  1. By monitoring the build, you'll know when your updated portfolio is ready to be viewed.
  2. Monitoring the build lets you know if any errors occurred during the build.

Also, please note that the very first time you try to build your portfolio, it takes about five minutes, which is a long time! Don't worry, though: after this very first build, GitHub will cache the build artifacts and your future builds should take less than a minute to complete.

Oh no! My very first build failed!

Unfortunately, some users have reported that their first build failed with an error like this:

error: RPC failed; curl 55 Failed sending HTTP2 data
fatal: the remote end hung up unexpectedly
fatal: the remote end hung up unexpectedly

This is not your fault (or ours): it means that there was a network connection problem on GitHub's side that resulted in a timeout. In our experience, all you have to do is re-trigger the build one more time. (You can do this by editing the _config.yml file and adding a space or newline, then committing the change).

The good news is that the files retrieved over the network for the first build are cached for the future, so it is unlikely you'll run into this particular error again upon subsequent builds of your portfolio.

Set gh_pages​

The above build process has created a new branch in your repo called "gh_pages". Now you need to tell the GitHub Pages mechanism that this is where to look for your professional portfolio files. To do this, click on the "Settings" tab, and then on the "Pages" tab. This will take you to the following page:

Click on the button named "Branch: main", and select "gh-pages", then click "Save". The page should now look like this:

Now click on the "Actions" tab and you'll notice that changing the branch from main to gh-pages has resulted in a new workflow run called "pages build and deployment":

This run only took 36 seconds, so it completed by the time I switched to this tab. If you click on this workflow run, you'll see a page like this:

As you can see, the "deploy" task provides a link to your professional portfolio.

View your portfolio​

Click the link to see your brand new professional portfolio:

Congratulations! The URL "https://philipmjohnson.github.io" now shows the portfolio for... Molly Maluhia?

TechFolios is developed by:
+

Initialization

You only have to do the following initialization tasks when you are setting up your TechFolio for the very first time.

Join GitHub​

To get started with TechFolios using this Quick Start, all you need is an account at GitHub. You don't need to download any software or even know how to use git. Everything you need to do for this Quick Start can be done in a browser.

If you haven't already, sign up for GitHub and verify your email address. Choose your username wisely, as that will become part of the URL to your portfolio site.

Username recommendations

Keep your username professional and close to your real name: "the3Gr8est" might seem super clever to you right now, but will be awkward and embarrassing to you during an interview next year. Restrict yourself to lowercase characters, numbers, and hyphens to make it simple to remember. Uppercase adds unnecessary confusion. Don't make your username location-specific: "philip-at-manoa" will be confusing if you move next year to San Francisco.

If you decide your current GitHub username could use some improvement, it is very easy to change your GitHub username to something more professional.

Before proceeding, login to your GitHub account.

Copy the template​

In this step, you'll make your personal copy of the TechFolio template.

First, go to https://github.com/techfolios/template:

Click the Use this template button. (If you don't see the "Use this template" button, make sure you are signed in to GitHub.) Select your account as the "Owner", and specify the repository name as your account name plus ".github.io". It should look like this:

Then press the Create repository from template button. GitHub will make a new copy of the template in your account and display a page like this:

Verify your repository name

Make sure the repository name is correct. As you can see in this example, since my GitHub username is "philipmjohnson", the repository name must be "philipmjohnson.github.io". If the first part of the repository name does not match your GitHub username exactly, then you need to rename your repository right now to make it match. Click on the Settings link to rename your repo, it's easy to fix.

Now let's fix the "About" section to link to your portfolio. Click on the gear icon next to the "About" label, which brings up a dialog box. Add "Professional Portfolio" as the description, add "https://USERNAME.github.io" (where USERNAME is your username) as the website, and (if you want) add "professional-portfolio" as a topic. The result should look like this:

After saving the changes, you'll have a convenient link to your professional portfolio on the home page for this repo.

Set workflow permissions to "Read and write"​

Now click on the Settings tab near the top of the window, then Actions and General in the left sidebar to display the Actions permissions page:

Check that Workflow permissions is set to "Read and write permissions". If not, click the radio button and press "Save".

Configure _config.yml​

Now that your repository is set up, we can start editing the template files to make this professional portfolio your own.

Scroll down the repository home page until you find the file named "_config.yml", and click on it, which will bring up a page that looks like this:

Click the pencil icon on the right hand side to edit the file:

The first section of the file, "Required Changes", contains the three lines you have to change. +Edit title: to specify your own name, edit url: to specify your portfolio, and edit baseurl: to be the empty string. When you're done editing, that section of _config.yml should look similar to this:

Scroll to the bottom of this page and click "Commit changes" to save these changes.

Monitor the build​

Every time you commit a change to your portfolio, GitHub will attempt to build and deploy your revised portfolio. It does this through a technology called GitHub Actions. In fact, GitHub is trying to build a new version of your portfolio right now. Let's watch.

First, click on the "Actions" label on the home page of your repository. That will take you to a page that looks like this:

This page indicates that two GitHub Actions (i.e. "workflows") named "pages-build-deployment" have previously run and completed successfully (indicated by the green checkmarks). There is a workflow called "Jekyll Deploy" that is running right now (indicated by the yellow dot). GitHub labels this workflow execution instance using the commit message associated with the change to the repository that triggered the Action. In this case, it was "Update _config.yml".

You can watch the build in more detail by clicking on the "Update _config.yml" line, which takes you to a page like this:

Clicking on the "build_and_deploy" label takes you to a page that shows the actual progress through the build:

Finally, you can click on the arrow next to any build step and see what happened during it:

After a few minutes, the Jekyll Deploy workflow will complete and the Actions page will look like this:

Notice that there is a green checkmark beside the "Update _config.yml" workflow run, indicating that it has completed successfully.

Why monitor the build?

There are two reasons it is useful to know how to monitor the build:

  1. By monitoring the build, you'll know when your updated portfolio is ready to be viewed.
  2. Monitoring the build lets you know if any errors occurred during the build.

Also, please note that the very first time you try to build your portfolio, it takes about five minutes, which is a long time! Don't worry, though: after this very first build, GitHub will cache the build artifacts and your future builds should take less than a minute to complete.

Oh no! My very first build failed!

Unfortunately, some users have reported that their first build failed with an error like this:

error: RPC failed; curl 55 Failed sending HTTP2 data
fatal: the remote end hung up unexpectedly
fatal: the remote end hung up unexpectedly

This is not your fault (or ours): it means that there was a network connection problem on GitHub's side that resulted in a timeout. In our experience, all you have to do is re-trigger the build one more time. (You can do this by editing the _config.yml file and adding a space or newline, then committing the change).

The good news is that the files retrieved over the network for the first build are cached for the future, so it is unlikely you'll run into this particular error again upon subsequent builds of your portfolio.

Set gh_pages​

The above build process has created a new branch in your repo called "gh_pages". Now you need to tell the GitHub Pages mechanism that this is where to look for your professional portfolio files. To do this, click on the "Settings" tab, and then on the "Pages" tab. This will take you to the following page:

Click on the button named "Branch: main", and select "gh-pages", then click "Save". The page should now look like this:

Now click on the "Actions" tab and you'll notice that changing the branch from main to gh-pages has resulted in a new workflow run called "pages build and deployment":

This run only took 36 seconds, so it completed by the time I switched to this tab. If you click on this workflow run, you'll see a page like this:

As you can see, the "deploy" task provides a link to your professional portfolio.

View your portfolio​

Click the link to see your brand new professional portfolio:

Congratulations! The URL "https://philipmjohnson.github.io" now shows the portfolio for... Molly Maluhia?

- + \ No newline at end of file diff --git a/docs/quick-start/next-steps.html b/docs/quick-start/next-steps.html index 7fe70d7..66d007a 100644 --- a/docs/quick-start/next-steps.html +++ b/docs/quick-start/next-steps.html @@ -6,7 +6,7 @@ Next steps | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii
- + \ No newline at end of file diff --git a/docs/quick-start/overview.html b/docs/quick-start/overview.html index c3083d0..3ada3b2 100644 --- a/docs/quick-start/overview.html +++ b/docs/quick-start/overview.html @@ -6,7 +6,7 @@ Overview | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/anatomy-of-bio-json.html b/docs/user-guide/anatomy-of-bio-json.html index abe67cc..e810518 100644 --- a/docs/user-guide/anatomy-of-bio-json.html +++ b/docs/user-guide/anatomy-of-bio-json.html @@ -6,7 +6,7 @@ Anatomy of bio.json | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/customize-layout.html b/docs/user-guide/customize-layout.html index 5cc2694..421ef8c 100644 --- a/docs/user-guide/customize-layout.html +++ b/docs/user-guide/customize-layout.html @@ -6,7 +6,7 @@ Customize layout | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/customize-theme.html b/docs/user-guide/customize-theme.html index b9b4ead..dbd8634 100644 --- a/docs/user-guide/customize-theme.html +++ b/docs/user-guide/customize-theme.html @@ -6,7 +6,7 @@ Customize theme | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/drafts.html b/docs/user-guide/drafts.html index c066dd6..6a8275b 100644 --- a/docs/user-guide/drafts.html +++ b/docs/user-guide/drafts.html @@ -6,7 +6,7 @@ Drafts | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/essay-and-project-tips.html b/docs/user-guide/essay-and-project-tips.html index 12a10e0..9f7b171 100644 --- a/docs/user-guide/essay-and-project-tips.html +++ b/docs/user-guide/essay-and-project-tips.html @@ -6,7 +6,7 @@ Essay and Project Tips | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/formatting.html b/docs/user-guide/formatting.html index 44074c7..57b42f3 100644 --- a/docs/user-guide/formatting.html +++ b/docs/user-guide/formatting.html @@ -6,7 +6,7 @@ Format text, images, video | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/invalid-date-field.html b/docs/user-guide/invalid-date-field.html index 5318c08..a7d1843 100644 --- a/docs/user-guide/invalid-date-field.html +++ b/docs/user-guide/invalid-date-field.html @@ -6,7 +6,7 @@ Invalid Date Field | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/local-development.html b/docs/user-guide/local-development.html index 5e43bf7..7768cc8 100644 --- a/docs/user-guide/local-development.html +++ b/docs/user-guide/local-development.html @@ -6,7 +6,7 @@ Local development | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/locale-problem.html b/docs/user-guide/locale-problem.html index b2102d6..66b97eb 100644 --- a/docs/user-guide/locale-problem.html +++ b/docs/user-guide/locale-problem.html @@ -6,7 +6,7 @@ Error: Invalid US-ASCII character | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/missing-page.html b/docs/user-guide/missing-page.html index d8c38e8..7578f7e 100644 --- a/docs/user-guide/missing-page.html +++ b/docs/user-guide/missing-page.html @@ -6,7 +6,7 @@ Missing pages | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/overview.html b/docs/user-guide/overview.html index c6219ab..46fbfa8 100644 --- a/docs/user-guide/overview.html +++ b/docs/user-guide/overview.html @@ -6,7 +6,7 @@ Overview | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/project-and-essay-url.html b/docs/user-guide/project-and-essay-url.html index 63c56b8..1d94eb5 100644 --- a/docs/user-guide/project-and-essay-url.html +++ b/docs/user-guide/project-and-essay-url.html @@ -6,7 +6,7 @@ Project and Essay URLs | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/docs/user-guide/tool-installation.html b/docs/user-guide/tool-installation.html index 7f69bea..7e17290 100644 --- a/docs/user-guide/tool-installation.html +++ b/docs/user-guide/tool-installation.html @@ -6,16 +6,16 @@ Tool installation | TechFolios - +
-

Tool installation

To more easily manage your portfolio, you should install three tools on your computer: (a) a git client so you you can download and upload the GitHub repository containing your site's files, (b) an editor so you can edit your source files, and (c) Jekyll so you can build your site locally and see changes quickly.

Install GitHub Desktop (or another git client)​

If you are using MacOS or Windows, the easiest way to manage your portfolio repository is with GitHub Desktop. GitHub Desktop provides an extremely easy way to download your portfolio files from GitHub to your computer for editing, and then push the files back to GitHub for deployment once you're ready for that to happen.

If you are using Linux, then you will need to install a different git client. If you are using Linux, you probably know this already and already have a git client installed.

Install an editor​

You cannot use a word processor like Microsoft Word to edit your professional portfolio. Instead, you need a text editor such as Emacs, Vim, IntelliJ IDEA, Microsoft Visual Studio, Eclipse, Atom, or similar.

Please be sure to install a text editor on your computer. Any one will do.

Install Jekyll​

The final step is to install Jekyll. Jekyll runs on all platforms.

To verify that you've installed Jekyll correctly, please go through the Jekyll Quickstart instructions to be sure that you can create a simple Jekyll site and display it on your computer.

You need to run bundle add webrick

The Jekyll documentation for the Quick Start notes that "Step 5 may fail". Yes, it almost certainly will. As instructed, go ahead and run: 

bundle add webbrick

Then run bundle exec jekyll serve and things should work correctly.

If you have followed the Quickstart instructions successfully, then you should be able to go to http://127.0.0.1:4000/ and see the following page:

Make sure you can see this page after running bundle exec jekyll serve. Once you can, then you know you have successfully installed Jekyll.

Now that you have GitHub Desktop, an editor, and Jekyll, let's see how to build and view your professional portfolio locally.

- + \ No newline at end of file diff --git a/img/.DS_Store b/img/.DS_Store deleted file mode 100644 index 4f8f891..0000000 Binary files a/img/.DS_Store and /dev/null differ diff --git a/img/quickstart/.DS_Store b/img/quickstart/.DS_Store deleted file mode 100644 index 5008ddf..0000000 Binary files a/img/quickstart/.DS_Store and /dev/null differ diff --git a/img/quickstart/action-permissions.png b/img/quickstart/action-permissions.png new file mode 100644 index 0000000..65a2e53 Binary files /dev/null and b/img/quickstart/action-permissions.png differ diff --git a/index.html b/index.html index 4a53daa..3422de5 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,7 @@ TechFolios | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file diff --git a/markdown-page.html b/markdown-page.html index 901f541..f8ecab3 100644 --- a/markdown-page.html +++ b/markdown-page.html @@ -6,7 +6,7 @@ Markdown page example | TechFolios - + @@ -15,7 +15,7 @@ Collaborative Software Development Laboratory
Department of Information and Computer Sciences
University of Hawaii - + \ No newline at end of file