One place for hosting & domains

      Github

      How to Use GitHub for WordPress Development


      If you’ve spent much time reading up on WordPress, chances are you’ve heard about GitHub. It’s one of the most popular platforms for developers to host their projects and collaborate with others. Maybe you’ve even considered trying it out yourself but don’t know where to start.

      The time has come to familiarize yourself with this invaluable WordPress resource. GitHub is an excellent platform for tracking, managing, and collaborating on development projects, so it’s well worth learning how to use. It enables you to host projects online and use the powerful version control of Git to keep track of every change.

      An Introduction to GitHub

      GitHub may look overwhelming if you’re a newcomer, but at its core, it’s actually pretty simple. In essence, GitHub is a free hosting service specifically designed for developers. Its primary use is to host projects for sharing and collaboration, making them available so that other users can contribute to and download them:

      The Github WordPress repository

      As the name implies, GitHub is built around the functionality of Git. This is a version control system that tracks all changes made to a project. What makes this system so powerful is how comprehensive it is. Since Git keeps track of every file and change in your project, it enables you to revert quickly to any previous version.

      Git also lets developers create ‘branches’, which are copies of a project that you can work on independently. Creating branches gives you the opportunity to make and test changes without affecting the whole project. You can then ‘merge’ your changes into the main branch if you want or simply discard them.

      These features are key to understanding why Git and GitHub are so invaluable to developers. You don’t have to worry about causing irreparable damage to a project, for example, since you can always create branches and roll back all revisions.

      Plus, it’s easy to collaborate on a project with a potentially unlimited number of users. In fact, this is exactly how WordPress itself is developed these days.

      Getting Started with GitHub

      Before you can start using GitHub, you’ll need a system for using Git and GitHub together. First of all, you’ll need to download and install Git on your local machine. You’ll be using it to perform crucial GitHub related-tasks, such as transferring files between your computer and your GitHub repository.

      GitHub is only the host for the project, so all the actual development happens on your local machine. Git then uses ‘repositories’ to store each project.

      This might sound confusing, in theory, so let’s look at a typical workflow:

        1. You have a project hosted in a repository on GitHub.
        2. You create a local repository and use Git to ‘pull’ in the latest version of the project from GitHub.
        3. You can now work on the project on your local computer. When you have made changes, you can ‘push’ them back into the GitHub repository.

      How you decide to structure your specific workflow depends on your preferences and the project’s requirements. The important thing is that your process works smoothly for you, your project, and your collaborators.

      Finally, to get the most out of Git, you’ll want to use the command line. Git is most commonly used through Secure Shell (SSH), which features a command line interface. If you don’t already know how to use the command line, we recommend that you familiarize yourself with the process before getting started.

      How to Use GitHub for WordPress Development (In 7 Steps)

      Now, it’s time for you to try out GitHub development for yourself! In this example, you’ll be creating a GitHub project for developing a WordPress theme. We’ll show you how to create a GitHub account and two repositories before showing you how to transfer your theme back and forth between them.

      Step 1: Create a Local WordPress Environment

      When you’re developing WordPress, it’s important to always use a staging environment. This gives you the freedom to try new things without worrying about how they will affect your live site.

      In this case, you’re going to create a local staging environment by installing WordPress on your computer. You can do this in a few different ways, but we recommend using Local, which enables you to quickly create a local version of WordPress for free:

      The Local homepage

      Simply select your platform and download the free version of Local. Then you’ll just need to run the installer.

      The installer will take a moment to work. After it’s completed, you can create and configure a new local WordPress site, following the instructions in this guide.

      Step 2: Install Git on Your Local Machine

      It’s now time to install Git. If you are running a recent version of Mac OS, you might find that Git is already on your machine. You can check this by opening your command line interface, such as Terminal, and entering the following command:

      git --version

      If Git is installed, this function will return its version number. If not, you will instead be asked if you want to install it right away. You can also download the installer and run it manually for Mac, Linux, and Windows computers.

      If you’re not comfortable with the command line interface, you might want to consider downloading a Git GUI application instead. However, for this example, we’re going to use the standard command line method. Either way, once Git is installed, you’re ready to create a local repository.

      Get Content Delivered Straight to Your Inbox

      Subscribe to our blog and receive great content just like this delivered straight to your inbox.

      Step 3: Create a Local Repository for Your Project

      You can now create a local Git repository for your project. In this example, we’ll use the Twenty Twenty-One theme, which should already be included in your local WordPress installation.

      First, you’ll need to access the theme’s folder using the following command:

      cd /Users/you/Documents/Websites/website/wp-content/themes/twentytwentyone

      Make sure to change this file path so that it leads to the right directory by replacing you and website with the correct folder names. You can now initialize this directory as a repository with the following command:

      git init

      Next, you’ll need to add your files to the index. This process tells Git which files you have added or edited since the last time you performed a commit (in other words, saved your changes).

      Since this is the first commit, you can use the following command to add every file in the folder:

      git add

      You can now commit your changes. The following command will commit all files in the index and include a message to help you keep your versions organized:

      git commit -m "The first commit"

      You have now finished configuring your local repository! That means it’s time to turn your attention towards GitHub.

      Step 4: Register a GitHub Account

      At this point, you’ll want to create a GitHub account. Start by accessing the GitHub homepage and filling in the registration form:

      The signup form for Github

      The interactive signup form will prompt you to enter a password and username and confirm your email address. Then, you’ll be asked to choose how many team members will be working with you and whether you’re a student or a teacher:

      Signing up for GitHub

      After that, you’ll be asked which features you’re interested in using. We recommend selecting Collaborative coding at a minimum:

      The GitHub signup process

      Now you can choose the free plan by clicking on Continue for free:

      Selecting the GitHub free plan

      You’ll then be taken directly to your GitHub dashboard. If you want to know more about the basics of using GitHub, we recommend taking some time to read the aforementioned guide. For now, however, we’re going to create a repository.

      Step 5: Create a Repository on GitHub

      You’re finally ready to create the GitHub repository for your project. This is a fairly simple process and only requires you to configure a few settings. Let’s start from the top.

      To get started, click on Create repository in your dashboard:

      Create a new repository with GitHub

      First, you can select the repository’s owner, which is effectively the admin for the repository. This should already be set to yourself, so you can leave it as-is:

      Next, you’ll need to give your repository a descriptive and concise name. You may want to name it after the plugin, theme, or other project you’ll be working on.

      After that, you can enter a description of the project. Again, this should be specific and descriptive so that other developers and users can understand what it is you’re creating.

      Since you signed up for a free account, you will only be able to create a public repository (although that’s all you’ll need right now). You’ll also be given the option to immediately clone the repository to your computer using a README file. Since you already have a local repository in place, you shouldn’t select this option now. However, it can be a handy tool for future projects.

      Finally, you’ll see two drop-down menus at the bottom of this screen. The first enables you to select a gitignore option if you want Git to ignore certain files from being tracked.

      The second option lets you choose a license for your repository. When you’re creating a real project, it’s important that you carefully consider what license to use. WordPress has very specific rules about licenses, which you’ll need to be aware of when developing for the platform.

      For now, you can simply choose None from that menu and then click on Create repository to finish setting things up:

      This will take you to your new project, which means it’s time to add your theme.

      Step 6: Commit Your Project to GitHub

      You can now push your theme to GitHub. Enter the following command into Git, making sure to replace the URL with a link to the repository you just set up:

      git remote add origin https://github.com/yourusername/my-git-theme.git
      
      git push -u origin master

      You will then be prompted to enter your GitHub username, followed by your password. When you have done that, all the files you have committed to your local repository will be pushed to your GitHub project:

      If you return to your GitHub repository, you will see that all files have been added to it.

      Step 7: Fetch Updates from GitHub to Your Local Repository

      You now have two repositories set up, and you know how to push changes from your local machine to the GitHub project. The final step is to flip this process and learn how to pull data from GitHub to your local installation.

      If you’re working alone on a project, you’ll rarely need to worry about doing this. However, it becomes necessary if other developers are pushing their changes into the external repository as well.

      You can do this easily by using the fetch command. Simply enter this command into Git, replacing the URL with the correct one for your GitHub project:

      git fetch https://github.com/yourusername/my-git-theme.git

      This command will pull all changes from GitHub and copy them over. Your local repository will now be synced up with your GitHub repository.

      With that done, you have successfully created a new GitHub project for a WordPress theme! At this point, feel free to continue experimenting with these tools to see what you can accomplish.

      Get Started With WordPress Development Using GitHub

      Using GitHub for WordPress development grants you absolute power over every aspect of your projects. By using Git’s powerful version control features, you’ll get access to each change, enabling you to easily revert to earlier versions of your files. Git and GitHub also make it easy for multiple developers to collaborate on the same project.

      To start using GitHub for WordPress development, you’ll simply need to create a local WordPress environment, install Git, and sign up for GitHub. Then, you can create a local repository for your project and make a GitHub repository. Finally, you’ll need to commit your project to GitHub and fetch updates to your local repository.

      Are you looking for a WordPress hosting provider with developer-friendly features? At Dreamhost, we offer advanced features like SFTP, SSH access, easy access to the command line, and more. Check out our DreamPress plans for more information!

      Do More with DreamPress

      DreamPress Plus and Pro users get access to Jetpack Professional (and 200+ premium themes) at no added cost!

      Managed WordPress Hosting - DreamPress



      Source link

      How To Automate Deployment Using CircleCI and GitHub on Ubuntu 18.04


      The author selected International Medical Corps to receive a donation as part of the Write for DOnations program.

      Introduction

      Continuous Integration/Continuous Deployment (CI/CD) is a development practice that allows software teams to build, test, and deploy applications easier and quicker on multiple platforms. CircleCI is a popular automation platform that allows you to build and maintain CI/CD workflows for your projects.

      Having continuous deployment is beneficial in many ways. It helps to standardize the deployment steps of an application and to protect it from un-recorded changes. It also helps avoid performing repetitive steps and lets you focus more on development. With CircleCI, you can have a single view across all your different deployment processes for development, testing, and production.

      In this tutorial, you’ll build a Node.js app locally and push it to GitHub. Following that, you’ll configure CircleCI to connect to a virtual private server (VPS) that’s running Ubuntu 18.04, and you’ll go through the steps to set up your code for auto-deployment on the VPS. By the end of the article, you will have a working CI/CD pipeline where CircleCI will pick up any code you push from your local environment to the GitHub repo and deploy it on your VPS.

      Prerequisites

      Before you get started, you’ll need to have the following:

      Step 1 — Creating a Local Node Project

      In this step, you’ll create a Node.js project locally that you will use during this tutorial as an example application. You’ll push this to a repo on GitHub later.

      Go ahead and run these commands on your local terminal so that you can set up a quick Node development environment.

      First, create a directory for the test project:

      Change into the new directory:

      Follow this up by initializing a npm environment to pull the dependencies if you have any. The -y flag will auto-accept every prompt thrown by npm init:

      For more information on npm, check out our How To Use Node.js Modules with npm and package.json tutorial.

      Next, create a basic server that serves Hello World! when someone accesses any route. Using a text editor, create a file called app.js in the root directory of the project. This tutorial will use nano:

      Add the following code to the app.js file:

      circleci-test/app.js

      const http = require('http');
      
      http.createServer(function (req, res) {
        res.write('Hello World!'); 
        res.end(); 
      }).listen(8080, '0.0.0.0'); 
      

      This sample server uses the http package to listen to any incoming requests on port 8080 and fires a request listener function that replies with the string Hello World.

      Save and close the file.

      You can test this on your local machine by running the following command from the same directory in the terminal. This will create a Node process that runs the server (app.js):

      Now visit the http://localhost:8080 URL in your browser. Your browser will render the string Hello World!. Once you have tested the app, stop the server by pressing CTRL+C on the same terminal where you started the Node process.

      You’ve now set up your sample application. In the next step, you will add a configuration file in the project so that CircleCI can use it for deployment.

      Step 2 — Adding a Config File to Your Project

      CircleCI executes workflows according to a configuration file in your project folder. In this step, you will create that file to define the deployment workflow.

      Create a folder called .circleci in the root directory of your project:

      Add a new file called config.yml in it:

      • nano .circleci/config.yml

      This will open a file with the YAML file extension. YAML is a language that is often used for configuration management.

      Add the following configuration to the new config.yml file:

      circleci-test/.circleci/config.yml

      version: 2.1
      
      # Define the jobs we want to run for this project
      jobs:
        pull-and-build:
          docker:
            - image: arvindr226/alpine-ssh
          steps:
            - checkout
            - run: ssh -oStrictHostKeyChecking=no -v [email protected]$IP "./deploy.sh"
      
      # Orchestrate our job run sequence
      workflows:
        version: 2
        build-project:
          jobs:
            - pull-and-build:
                filters:
                  branches:
                    only:
                      - main
      

      Save this file and exit the text editor.

      This file tells the CircleCI pipeline the following:

      • There is a job called pull-and-build whose steps involve spinning up a Docker container, SSHing from it to the VPS, and then running the deploy.sh file.
      • The Docker container serves the purpose of creating a temporary environment for executing the commands mentioned in the steps section of the config. In this case, all you need to do is SSH into the VPS and run sh deploy.sh command, so the environment needs to be lightweight but still allow the SSH command. The Docker image arvindr226/alpine-ssh is an Alpine Linux image that supports SSH.
      • deploy.sh is a file that you will create in the VPS. It will run every time as a part of the deployment process and will contain steps specific to your project.
      • In the workflows section, you inform CircleCI that it needs to perform this job based on some filters, which in this case is that only changes to the main branch will trigger this job.

      Next, you will commit and push these files to a GitHub repository. You will do this by running the following commands from the project directory.

      First, initialize the Node.js project directory as a git repo:

      Go ahead and add the new changes to the git repo:

      Then commit the changes:

      • git commit -m "initial commit"

      If this is the first time committing, git will prompt you to run some git config commands to identify you.

      From your browser navigate to GitHub and log in with your GitHub account. Create a new repository called circleci-test without a README or license file. Once you’ve created the repository, return to the command line to push your local files to GitHub.

      To follow GitHub protocol, rename your branch main with the following command:

      Before you push the files for the first time, you need to add GitHub as a remote repository. Do that by running:

      • git remote add origin https://github.com/GitHub_username/circleci-test

      Follow this with the push command, which will transfer the files to GitHub:

      You have now pushed your code to GitHub. In the next step, you’ll create a new user in the VPS that will execute the steps in the pull-and-build part.

      Step 3 — Creating a New User for Deployment

      Now that you have the project ready, you will create a deployment user in the VPS.

      Connect to your VPS as your sudo user

      • ssh your_username@your_server_ip

      Next, create a new user that doesn’t use a password for login using the useradd command.

      • sudo useradd -m -d /home/circleci -s /bin/bash circleci

      This command creates a new user on the system. The -m flag instructs the command to create a home directory specified by the -d flag.

      circleci will be the new deployment user in this case. For security purposes, you are not going to add this user to the sudo group, since the only job of this user is to create an SSH connection from the VPS to the CircleCI network and run the deploy.sh script.

      Make sure that the firewall on your VPS is open to port 8080:

      You now need to create an SSH key, which the new user can use to log in. You are going to create an SSH key with no passphrase, or else CircleCI will not be able to decrypt it. You can find more information in the official CircleCI documentation. Also, CircleCI expects the format of the SSH keys to be in the PEM format, so you are going to enforce that while creating the key pair.

      Back on your local system, move to your home folder:

      Then run the following command:

      • ssh-keygen -m PEM -t rsa -f .ssh/circleci

      This command creates an RSA key with the PEM format specified by the -m flag and the key type specified by the -t flag. You also specify the -f to create a new key pair called circleci and circleci.pub. Specifying the name will avoid overwriting your existing id_rsa file.

      Print out the new public key:

      This outputs the public key that you generated. You will need to register this public key in your VPS. Copy this to your clipboard.

      Back on the VPS, create a .ssh directory for the circleci user:

      • sudo mkdir /home/circleci/.ssh

      Here you’ll add the public key you copied from the local machine into a file called authorized_keys:

      • sudo nano /home/circleci/.ssh/authorized_keys

      Add the copied public key here, save the file, and exit the text editor.

      Give the circleci user its directory permissions so that it doesn’t run into permission issues during deployment.

      • sudo chown -R circleci:circleci /home/circleci

      Verify if you can log in as the new user by using the private key. Open a new terminal on your local system and run:

      You will now log in as the circleci user into your VPS. This shows that the SSH connection is successful. Next, you will connect your GitHub repo to CircleCI.

      Step 4 — Adding Your GitHub Project to CircleCI

      In this step, you’ll connect your GitHub account to your CircleCI account and add the circleci-test project for CI/CD. If you signed up with your GitHub account, then your GitHub will be automatically linked with your CircleCI account. If not, head over to https://circleci.com/account and connect it.

      To add your circleci-test project, navigate to your CircleCI project dashboard at https://app.circleci.com/projects/project-dashboard/github/your_username:

      CircleCI Projects Tab

      Here you will find all the projects from GitHub listed. Click on Set Up Project for the project circleci-test. This will bring you to the project setup page:

      Setting up a project in the CircleCI Interface

      You’ll now have the option to set the config for the project, which you have already set in the repo. Since this is already set up, choose the Use Existing Config option. This will bring up a popup box confirming that you want to build the pipeline:

      Popup confirming the config file for the CircleCI build

      From here, go ahead and click on Start Building. This will bring you to the circleci-test pipeline page. For now, this pipeline will fail. This is because you must first update the SSH keys for your project.

      Navigate to the project settings at https://app.circleci.com/settings/project/github/your_username/circleci-test and select the SSH keys section on the left.

      Retrieve the private key named circleci you created earlier from your local machine by running:

      Copy the output from this command.

      Under the Additional SSH Keys section, click on the Add SSH Key button.

      Adding SSH Keys section of the settings page

      This will open up a window asking you to enter the hostname and the SSH key. Enter a hostname of your choice, and add in the private SSH key that you copied from your local environment.

      CircleCI will now be able to log in as the new circleci user to the VPS using this key.

      The last step is to provide the username and IP of the VPS to CircleCI. In the same Project Settings page, go to the Environment Variables tab on the left:

      Environment Variables section of the settings page

      Add an environment variable named USER with a value of circleci and IP with the value of the IP address of your VPS (or domain name of your VPS, if you have a DNS record).

      Once you’ve created these variables, you have completed the setup needed for CircleCI. Next, you will give the circleci user access to GitHub via SSH.

      Step 5 — Adding SSH Keys to GitHub

      You now need to provide a way that the circleci user can authenticate with GitHub so that it can perform git operations like git pull.

      To do this, you will create an SSH key for this user to authenticate against GitHub.

      Connect to the VPS as the circleci user:

      Create a new SSH key pair with no passphrase:

      Then output the public key:

      Copy the output, then head over to your circleci-test GitHub repo’s deploy key settings at https://github.com/your_username/circleci-test/settings/keys.

      Click on Add deploy key to add the copied public key. Fill the Title field with your desired name for the key, then add the copied public key in the Key field. Finally, click the Add key button to add the key to your account.

      Now that the circleci user has access to your GitHub account, you’ll use this SSH authentication to set up your project.

      Step 6 — Setting Up the Project on the VPS

      Now for setting up the project, you are going to clone the repo and make the initial setup of the project on the VPS as the circleci user.

      On your VPS, run the following command:

      Navigate into it:

      First, install the dependencies:

      Now test the app out by running the server you built:

      Head over to your browser and try the address http://your_vps_ip:8080. You will receive the output Hello World!.

      Stop this process with CTRL+C and use pm2 to run this app as a background process.

      Install pm2 so that you can run the Node app as an independent process. pm2 is a versatile process manager written in Node.js. Here it will help you keep the sample Node.js project running as an active process even after you log out of the server. You can read a bit more about this in the How To Set Up a Node.js Application for Production on Ubuntu 18.04 tutorial.

      Note: On some systems such as Ubuntu 18.04, installing an npm package globally can result in a permission error, which will interrupt the installation. Since it is a security best practice to avoid using sudo with npm install, you can instead resolve this by changing npm’s default directory. If you encounter an EACCES error, follow the instructions at the official npm documentation.

      You can use the pm2 start command to run the app.js file as a Node process. You can name it app using the --name flag to identify it later:

      • pm2 start app.js --name "app"

      You will also need to provide the deployment instructions. These commands will run every time the circleci user deploys the code.

      Head back to the home directory since that will be the path the circleci user will land in during a successful login attempt:

      Go ahead and create the deploy.sh file, which will contain the deploy instructions:

      You will now use a Bash script to automate the deployment:

      deploy.sh

      #!/bin/bash
      
      #replace this with the path of your project on the VPS
      cd ~/circleci-test
      
      #pull from the branch
      git pull origin main
      
      # followed by instructions specific to your project that you used to do manually
      npm install
      export PATH=~/.npm-global/bin:$PATH
      source ~/.profile
      
      pm2 restart app
      

      This will automatically change the working directory to the project root, pull the code from GitHub, install the dependencies, then restart the app. Save and exit the file.

      Make this file an executable by running:

      Now head back to your local machine and make a quick change to test it out. Change into your project directory:

      Open up your app.js file:

      • nano circleci-test/app.js

      Now add in the following highlighted line:

      circleci-test/app.js

      const http = require('http');
      
      http.createServer(function (req, res) {
        res.write('Foo Bar!');
        res.end();
      }).listen(8080, '0.0.0.0');
      

      Save the file and exit the text editor.

      Add this change and commit it:

      • git add .
      • git commit -m "modify app.js"

      Now push this to your main branch:

      This will trigger a new pipeline for deployment. Navigate to https://app.circleci.com/pipelines/github/your_username to view the pipeline in action.

      Once it’s successful, refresh the browser at http://your_vps_ip:8080. Foo Bar! will now render in your browser.

      Conclusion

      These are the steps to integrate CircleCI with your GitHub repository and Linux-based VPS. You can modify the deploy.sh for more specific instructions related to your project.

      If you would like to learn more about CI/CD, check out our CI/CD topic page. For more on setting up workflows with CircleCI, head over to the CircleCI documentation.



      Source link

      Deploying to DigitalOcean With GitHub Actions


      Video

      https://www.youtube.com/watch?v=vhIOCbuVKw4

      About the Talk

      Find yourself juggling between different tools in your software development & deployment workflow? Get tips to simplify your workflow using GitHub Actions and DigitialOcean’s APIs, and watch a demo of running a CI/CD pipeline — powered by GitHub Actions — to deploy on DigitalOcean.

      GitHub Actions enables you to code, build, test, publish and deploy your software in a single location, all within GitHub.

      What You’ll Learn

      • How to use DigitalOcean APIs and CLIs to automate tasks
      • Automating software workflows within GitHub using GitHub Actions
      • Leveraging open source community contributions for your workflows

      Resources

      About the Presenter

      Karan MV currently manages developer relations for GitHub India. When he is not working, you can find him reading books of various genres, studying filmmaking, and honing his acting and stage-anchoring skills.



      Source link