LogoLogo
HomeGitHub
v0
v0
  • 🏃‍♂️Getting started!
  • 📝Filling up your page
  • 🌐Custom domain name
  • 📣Favicon and Meta Tags
  • 🔡Custom fonts
  • 🛤️Adding more pages
  • 🎨Theme customization
  • 🎇Restyling components
Powered by GitBook
On this page
  • Overview
  • Step by step guide

Getting started!

NextFilling up your page

Last updated 2 years ago

Overview

Let's start with an overview of what we are trying to achieve.

Let's check how is setup.

The code of the website lies on a of the . The files that are actualy served by lies on the branch and is put there using .

Step by step guide

# Only if you don't have yarn already 
# (you need https://brew.sh to run the next command)
brew install yarn

#
git clone https://github.com/<user_name>/<project_name> <project_name>_landingpage 
cd <project_name>_landingpage

git checkout --orphan landingpage && git rm -rf .
yarn create react-app . --scripts-version 4.0.3 --template typescript
mkdir -p .github/workflows
wget gitlanding.dev/deploy.yaml -O .github/workflows/deploy.yaml
# Don't get frightened by the next command.
# It will just update the "homepage" field with: 
# https://<your_github_username>.github.io/<your_repo_name> 
# in the package.json.
# Feel free to do that manually.
node -e '(()=>{require("fs").writeFileSync("package.json",JSON.stringify({...require("./package.json"),"homepage": (() => {const [r, u] = `${require("child_process").execSync("git remote get-url origin")}`.replace(/\n/g, "").replace(".git", "").replace(/:/g, "/").replace(/\r?\n$/, "").split("/").reverse();return `https://${u}.github.io/${r}`;})()}, null, 2));})()'
git add -A
git commit -m "Initial commit"
git push --set-upstream origin landingpage

Open a Powershell terminal

git clone https://github.com/<user_name>/<project_name> <project_name>_landingpage 
cd <project_name>_landingpage

git checkout --orphan landingpage
git rm -rf .
yarn create react-app . --scripts-version 4.0.3 --template typescript
mkdir .github\workflows
curl gitlanding.dev/deploy.yaml -O .github/workflows/deploy.yaml
# Don't get frightened by the next command.
# It will just update the "homepage" field with: 
# https://<your_github_username>.github.io/<your_repo_name> 
# in the package.json.
# Feel free to do that manually.
node -e "(()=>{require('fs').writeFileSync('package.json',JSON.stringify({...require('./package.json'),'homepage': (() => {const [r, u] = ('' + require('child_process').execSync('git remote get-url origin')).replace(/\n/g, '').replace('.git', '').replace(/:/g, '/').replace(/\r?\n$/, '').split('/').reverse();return 'https://' + u + '.github.io/' + r;})()}, null, 2));})()"
git add -A
git commit -m "Initial commit"
git push --set-upstream origin landingpage
# Using Ubuntu
sudo su
curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -
# Using Debian
su root
curl -fsSL https://deb.nodesource.com/setup_16.x | bash -
####
apt-get install -y nodejs
npm install -g yarn

Open a new terminal

git clone https://github.com/<user_name>/<project_name> <project_name>_landingpage  
cd <project_name>_landingpage

git checkout --orphan landingpage && git rm -rf .
# If you get: 'yarn: error: no such option: --template' running the following command. It means you have 'yarn' from cmdtest, we need yarn the package manager.
yarn create react-app . --scripts-version 4.0.3 --template typescript
mkdir -p .github/workflows
wget gitlanding.dev/deploy.yaml -O .github/workflows/deploy.yaml
# Don't get frightened by the next command.
# It will just update the "homepage" field with: 
# https://<your_github_username>.github.io/<your_repo_name> 
# in the package.json.
# Feel free to do that manually.
node -e '(()=>{require("fs").writeFileSync("package.json",JSON.stringify({...require("./package.json"),"homepage": (() => {const [r, u] = `${require("child_process").execSync("git remote get-url origin")}`.replace(/\n/g, "").replace(".git", "").replace(/:/g, "/").replace(/\r?\n$/, "").split("/").reverse();return `https://${u}.github.io/${r}`;})()}, null, 2));})()'
git add -A
git commit -m "Initial commit"
git push --set-upstream origin landingpage

Next you'll have to enable GitHub page in your repo. Navigate to your repository on Github and go to Setting > Pages, then set the gh-pages branch as the branch from witch the site is to be built.

You may need to wait a few minutes for the initial gh-pages branche to be created by your GitHub Action workflow .github/workflows/deploy.yaml

If all went as expected you page should be up and running

You're now ready to start customizing this page with Gitlanding.

Open a new terminal (for example )

If you don't have it already, .

If you don't have installed allready:

🏃‍♂️
iTerm2
install Node.js
the yarn package manager
the landingpage of GitLangind itself
dedicated branch
GitLanding repo
GitHub Page
gh_page
this GitHub Action
https://github.com/USERNAME/REPO/settings/pages