Blog PostGit and OutSystems Together

Hugo Carajóinas's picture

Hugo Carajóinas


Feb 23 2023

Developing in OutSystems provides us with a platform that has built-in versioning and publishing capabilities. While this gives us a safety net for managing our code and rolling back changes, as front-end developers, we often need additional tools to manage our code effectively.

This is where Git comes in!

At first, you may think that Git cannot take advantage of OutSystems code, and while this is true, it is not a disadvantage when it comes to storing front-end code and other small resources. In fact, there are several advantages to using Git in conjunction with OutSystems:

  • Complex JavaScript files management: OutSystems allows developers to create complex components that will use a lot of JavaScript, in these cases we will actually add the JavaScript as a required script. However, managing this code within OutSystems can be difficult due to a lack of documenting changes made, improvements, and new features. Git can help manage the efficiency in tracking these changes and any breaking changes that might cause the component to not perform as expected.
  • Theme management: OutSystems works with CSS files, which can make it challenging to keep track of in a big project, especially if it’s in just one CSS sheet. In addition, since OutSystems does not allow the use of SASS, Git can help manage the themes by allowing developers to maintain a clean SASS repository, where we recommend that each component has its own separate file, making it easier to read and maintain the code.
  • Multiple Themes: You can also take advantage of Git and SASS to manage multiple themes in an easier way, while also improving your development speed and maintainability of the overall project. This can be done in different ways, according to the specificity of the project, either using multiple generated files or taking advantage of functions and variables (SASS or CSS).
  • A better view of changes: In projects with various modules and themes, tracking changes can be a challenge without proper documentation. Git can help provide that documentation by allowing developers to properly commit changes, making it easier to track and understand changes over time.
  • Blame features: during development it should be relevant to see who made a change to the code, not just as a way to check when a bug was introduced, but especially as a way to question the author in a situation where you are struggling to understand a specific part of the code.
An example of the history of commits done in one of our projects
An example of the history of commits done in one of our projects
Git: Almost mandatory for any front-end project

As you can see, using Git repositories to control versioning and to keep track of every change that's made to our codebase, is not only a very good assistance tool but it’s almost something mandatory for making sure of the quality of our front-end projects. Git allows you to save different versions and to revert to previous versions if necessary, and this is particularly useful when you have multiple people working on the same project.

Branching: How It Helps with Tracking and Maintaining Quality

One of the key features of Git is branching. This allows you to create a separate branch for each feature or change you make to your codebase, keeping everything organized and making it easier to track progress. For example, you could create a branch for a new feature, and when it's complete, merge it back into the main branch. This helps ensure that you don't overwrite any other changes that may have been made to the main branch, keeping everything organized and making it easier to track progress.

Let's consider two scenarios to understand how branching helps in Git

Scenario 1: Multiple Developers Working on the Same Project In this scenario, various developers are working on the same project. They each create branches for the feature they are working on. This way, they can work on the code without affecting each other. When they are both done, they can merge their branches into the main code. Scenario 2: Testing a New Feature In this scenario, a developer is working on a new feature. Instead of making changes to the main code, the developer creates a branch for the feature. This allows the developer to test the feature without affecting the main code. If the feature does not work, the developer can simply delete the branch and start over.

Commit Writing: The Key to Good Collaboration

Now that we have established the basis of git and how it can help with your project organization, we shall delve into another important aspect of Git: commit writing. A commit is essentially a snapshot of your codebase at a specific point in time. By writing clear and concise commit messages, you can easily see what changes have been made and why they were made. This makes it easier for other developers to understand your changes and helps ensure that everyone is working from the same codebase. The basic structure of a Conventional Commit message is as follows:

Conventional Commit structure
Conventional Commit structure


  • type: represents the type of change made in the commit. It is a single word, and should be chosen from a predefined list of types. Common types include feat (for new features), fix (for bug fixes), docs (for documentation changes), style (for style changes), refactor (for code refactoring), and test (for changes to tests).
  • optional scope: this is an optional field that provides more context on the change. It is written in lowercase letters and should be short and descriptive.
  • description: is a short, human-readable description of the change, written in the present tense and capitalized.
  • optional body: provides additional details on the change, if necessary. It should be separated from the header by a blank line and should be written in markdown format.
  • optional footer(s): includes metadata about the change, such as breaking changes, issue references, etc. It should be separated from the body by a blank line and should be written in markdown format.
An example of how it is easy to read the changes that were made using conventional commits
An example of how it is easy to read the changes that were made using conventional commits
Tech Lead Tips

Our tech lead is always hammering the importance of committing to every feature. To quote him: "You don't commit just at the end of the day, you should commit every time you add a feature". This highlights the importance of committing frequently, as it helps ensure that everyone is working from the same codebase and that changes are tracked and documented.

Conventional Commits, Git and Mediaweb

As we covered Git allows teams to track changes in their codebase, collaborate on projects, and maintain a work history. With proper commit practices, teams can stay organized and efficiently manage their codebase.

Here at Mediaweb we foster the use of good commit practices and use Conventional Commits as our commit structure, this way we can maintain a good commit structure, an organized git, and most importantly know what is happening in each of the projects we are working on.

Most of all, this proper commit practice aligns with Mediaweb’s values of Optimizing work processes and Striving for excellence as the lowest standard. Cover photo by AltumCode on Unsplash