Automatically push source code to a GitHub repository
Introduction
Pyronome is an online platform that allows software developers to develop sustainable and scalable software solutions quickly. Pyronome provides easy-to-use interfaces that make it possible to define software elements. Then these definitions can be transformed into source code in programming languages such as Java, C#, PHP, and others. Pyronome saves time in software production processes by converting frequently used source code snippets into reusable components. In addition to this, it separates software research and development processes with its reusable components approach. It helps to increase the quality of software production processes by enabling the digitization of experience.
This article is referencing the following tutorial video published on the Pyronome Youtube channel:
Table of contents
- Step 0: Before you begin
- Step 1: Creating the repository on GitHub
- Step 2: Adding the repository to the Pyronome project
- Step 3: Changing the directory structure and the repo definition
- Step 4: Pushing the generated source code
- Conclusion
Step 0: Before you begin
The first step in getting started with the Pyronome Platform is to become a member. Click here to access the member registration form. If you have a Pyronome account, you can log in.
This guide explains how to push generated project source code to a GitHub repository automatically. Previously, we had modeled and generated the source code of an application for displaying a line chart based on dates and values on these dates. AdminLTE 3.x, Laravel 6.x, and Vue.Js 2.x are used as a target technology for this project example. You can read the “Build a full stack web application in 15 minutes with Laravel + Vue.js + AdminLTE Admin Panel” tutorial article or watch the tutorial video published on the Pyronome YouTube channel.
When you complete this guide, you will learn to push generated source code to a GitHub repository for any web application project that you created by using the Pyronome Platform.
Before proceeding to the next step, you should create a GitHub account if you have not already one.
Step 1: Creating the repository on GitHub
Please log in to your GitHub account. After the first login to your GitHub account, click the “Create repository” on the homepage, and create your project’s repository by following these steps:
1. Select the “Owner” as the account name you want to use.
2. Enter the repository name as “history-chart-demo” in the “Repository name” field.
3. Select the “Private” option, which allows you to choose who can see and commit to the repository you created.
4. Click on the “Create repository” button. The repository is now created. GitHub directs automatically to the page of the repository you created, where you can see the information about the repository (Figure 1).
5. Copy the information to the clipboard by clicking the icon next to the address of the repo.
Now you can push the source code you have generated to this repository.
Step 2: Adding the repository to the Pyronome project
There is a “Settings” menu on the left side of the project page in the Pyronome Platform. The “Repositories” section under the “Settings” menu allows you to manage the repositories (Figure 2).
You can add the repository that you have just created on GitHub by the below steps:
1. Open the Repositories page. If there is an existing repository or repositories, they are listed on this page. You can add as many repositories as you want.
Note: The system automatically pushes the generated code after the code generation process to repositories that you defined in the Project’s repositories page, beginning from top to bottom in the list.
2. Click on the “New Repository” button to add a repository.
3. Enter the repository’s name as “GitHub Repository“ in the field of “Repository Name”.
4. Enter the e-mail address of the user you created on GitHub in the field of “E-mail Address”.
5. Enter the user name of the GitHub account you created in the field of “User Name”.
6. Choose the “Authenticate using HTTPS” option and enter the repository’s URL address, which is displayed on the GitHub repository code page.
7. Enter the GitHub account password or personal access token to the “HTTPS Password” field.
Note: Instead of using the password of your GitHub account, you should use the access token to access your GitHub repositories without entering your original GitHub user password, which makes your GitHub account more secure.
8. To create a personal access token, go to the GitHub settings page. Select “Developer settings” located on the left menu. Click on the “Personal access tokens” and then “Generate new token” on the pages opened. A new personal access token page (Figure 3.1 and Figure 3.2) appears.
9. After filling the “Note” field, which is for reminding the what’s this token for, select the “repo” option from the “Select scopes” and click on the “Generate token”. Once the personal access token is created, copy the token that appeared on the page and go to your project page on Pyronome.
10. Enter branch name in the “Branch Name” field.
11. Click the “Save” button to add the repository.
When you open the “Source Code” page, you will view the main directories of your project. The project code files are located under the directories shown in Figure 4.
Note: Pyronome platform allows you to change the directory structure or form an entirely new directory structure by using the repository edit dialog under the repositories section.
Step 3: Changing the directory structure and the repo definition
There are extra features on the repository edit dialog that you can define which directory should be uploaded under which directory conjugately. A source folder and target folder fields (Figure 5) allow you to shape and organize the resulting directory structure in your GitHub repository.
Additionally, if you need to delete the contents of some directories before uploading; You can add the paths of those directories by checking this Remove Source/Target Folder(s) checkbox (Figure 6).
The feature is handy when you want to deploy the source code on a platform like Heroku. For example, Heroku searches for composer.json, and package.json files under the topmost directory, so you need to copy them into the home directory after the code generation process before pushing them to the repository.
Please follow the following steps to define the directory structure:
1. Go to the “Repositories” section and open the repository “GitHub Repository” that you have just created.
2. Enter the following directory structure to the “Source Folder” and “Target Folder” fields to define the directory of source in the main directory and others under the Pyronome directory, as depicted in Figure 7.
- To copy the content in the “source” directory into the “source” directory, enter “/source/” and “/” to the “Source Folder” field and “Target Folder” field respectively.
- To copy the content in the “pyronome” directory into the “pyronome”, enter “/pyronome/” to the “Source Folder” field and and “/pyronome/” to the “Target Folder” field.
- To copy the content of the “install” directory into the “pyronome/instal” directory, enter “/install/” and “/pyronome/install/” to the “Source Folder” field and “Target Folder” field respectively.
- To copy the content of the “snippets” directory into the “pyronome/snippets” directory, enter “/snippets/” and “/pyronome/snippets/” to the “Source Folder” field and “Target Folder” field respectively.
Note: This directory structure will help us during the project staging process. When there is an update on the database structure, the generated migration procedures help us update the database structure in the target environment.
3. To prevent conflicts and complete database updates correctly, delete the migrations directory contents located under the database directory as follows:
- Click on the “Remove Source/Target Folder(s)” checkbox to view the “Remove Source Folder(s)” and “Remove Target Folder(s)” edit boxes.
- Enter “/database/migrations/” to the “Remove Target Folder(s)” field (Figure 8).
- Click the “Save” button.
Now you have added the repo definition and can proceed to push the generated source to your GitHub repository.
Step 4: Pushing the generated source code
Once you have defined the repository, you can proceed to the upload phase.
You can follow the steps below to push the repository:
1. Click the “Push Now” button (Figure 9).
2. Or go to the “Source Code” section on the menu and click the “Generate Now” button (Figure 10), which allows uploading the generated source to your GitHub repo automatically.
When you click the “Generate Now” button on the “Source Code” page, the entire code generation process is repeated, and it allows you to check that the whole process is completed from the beginning without errors. Since the code generation is completed, you can check the directories and files uploaded to your project’s repository on the GitHub page under the “Code” section (Figure 11).
You can notice that the source code files and related directories are committed automatically and appear in the GitHub repository by Pyronome, as you defined in the Pyronome repository definition. The “pyronome” directory (Figure 12) has been created in the main directory.
Furthermore, “install”, and “snippets” (Figure 13) directories have been created under the “pyronome” directory.
Conclusion
This guide describes how to create a repository on GitHub, add the repository you created to your Pyronome project, and make the necessary directory structure definitions you designed before uploading the generated source code into your repository. Finally, how to push generated source code to a GitHub repository for any web application project you created using Pyronome Platform was explained.
Visit Pyronome and enjoy the experience
Thanks for reading. You can register for free to try Pyronome right now. For further information, please visit the following links:
Do you have any questions or suggestions? Please let me know in the comments section.
