TutorialsLast Updated Jul 14, 20234 min read

Pushing a project to GitLab

Godwin Ekuma

Software Engineer

Developer D sits at a desk working on a beginning-level project.

GitLab is a collaborative Git repository that fosters open-source development by offering both free open and private repositories. With its extensive features such as issue tracking and wikis, GitLab empowers teams to collaborate effectively and create exceptional software solutions. GitHub and Bitbucket are similar tools.

CircleCI has launched support for Gitlab, so it is helpful to learn to use it. In this tutorial, I’ll show you how to push a project to GitLab.

Prerequisites

To follow this tutorial, a few things are required:

  1. Basic knowledge of Git
  2. Git installed on your system
  3. A GitLab account
  4. Node.js installed

Our tutorials are platform-agnostic, but use CircleCI as an example. If you don’t have a CircleCI account, sign up for a free one here.

With these set up, you can start the tutorial.

Setting up the Node.js project

For this tutorial, you will generate a simple Node.js project with Express Generator, a comprehensive utility that uses the express library. With Express-generator, you can set up a fully functional Node.js application in no time. To get started, run:

$ npx express-generator

This command generates a Node.js project with this folder structure:

    ├── app.js
    │   └── bin
    │       └── www
    ├── package.json
    ├── public
    │   ├── images
    │   ├── javascripts
    │   └── stylesheets
    │       └── style.css
    ├── routes
    │   ├── index.js
    │   └── users.js
    └── views
        ├── error.jade
        ├── index.jade
        └── layout.jade

Initializing Git

Before you can push this file to GitLab, you need to initialize Git.

Run:

git init

The git init command turns the Node.js project directory into a new Git repository. To confirm that the directory is now a Git repository, run the git status command. Git will generate an output for you to review.

Git init and git status output

Tracking files with Git

The project directory is now a Git repository, but Git is not yet tracking the files within the directory. The function git add . adds all untracked files to the “staging area”. Once you run that, Git starts tracking the changes. If you run the the git status command again, Git you tell you that it is now tracking the files.

Git init and git status output for staged files

Committing files

So far, you have created a new Node.js project, made a Git repository, and included it in the staging area. The next step is to create a permanent snapshot of these alterations. It’s time to commit!

Every commit captures a complete record of the repository’s current state, including the name, timestamp, and message of the person committing the changes. Provide a message, which serves as a note to yourself and future users, explaining the reasons behind the changes that you made.

Run:

git commit -m "initial project commit"

git status

The text following -m is the commit message.

Pushing to GitLab

Pushing uploads all your local commits to the remote repository. This makes the changes in your file available to people you are working with. There are two parts to this process:

  1. Creating a GitLab repository
  2. Pushing the project to GitLab

Creating a GitLab repository

If you haven’t already, open your browser, go to GitLab.com, and log in. Click the plus sign icon at the top left of the page. Then select New project/repository. Next, click Create blank project.

Create repository

Add a Project name, select a project Visibility level, and then click Create Project. I have used the name demo-repository for this tutorial. You will be using this name later on, so make a note of it.

New repository

There you have it, a sparkling new repository. If this is your first one, congratulations! You have reached a programming milestone.

Stay on this page to complete the next step.

Pushing the project to GitLab

Remember, you already have a local repository that you have committed changes to. Now, push these changes to the newly created GitLab repository.

Run:

git remote add origin https://gitlab.com/godwinekuma/demo-repository.git
git branch -M 'main'
git push -u origin 'main'

Note: Replace the GitLab username in the example with your GitLab username..

After running these commands, reload the browser page. The project files and folders are now listed in the online repository.

![Push existing repo]2023-06-20-existing-repo

You can make more updates to the repository by running these commands in order:

git add .
git commit -m "Commit message"
git push origin main

Replace the sample message (Commit message) with a descriptive one of your own. If you are working on a branch other than main, replace main with the name of the branch you are using. You can read more about git branching here.

Conclusion

GitLab and similar version control systems based on Git are widely used in software development and in other fields that require version control. Acquiring knowledge about these tools is an essential enhancement to your repertoire as a developer. In this guide, you learned how to transfer a Git repository from your local machine to GitLab.

Becoming familiar with Git and GitLab is crucial for progressing to the next phase, which involves setting up a continuous integration pipeline for your GitLab repository. To connect your GitLab repo and gain the confidence, flexibility, and speed you’ve been looking for, sign up now.

Copy to clipboard