Using GitHub Actions in Angular project

After a few days, we decide to submit an Idea and the prototype to the Hackathon CallForCode … In general terms, is an idea to centralize specific clinical data and implement on it relevant and specific uses cases, if you want, you can see a little more detail in

https://github.com/Pabloin/Hack_Call4Code

Ok, but, let´s advance in the Angular subject of this post: we have an Angular prototype, How we could integrate it in GitHub actions? Let´s describe the process, or the problems with it

Pre requisites

we have a public GitHub repo with an Angula 9+ app on it

https://github.com/Pabloin/Hack_Call4Code

And the app running in local

Let´s select Actions

Let´s try the first one:

GitHub Action for an “npm install”

This is the first “half part” of the work, but the simpler … in the next post section, will try the Angular specific commands …

You can see the source code on GitHub, for copy&paste:

https://github.com/Pabloin/Hack_Call4Code/blob/feature/ID-%236-GitHub-Actions-Angular/.github/workflows/pei-angular.yml

Let´s make a couple of push on the specific branch

And, we can verify that the hook is alive!

Hook alive, and in Work In Progress (WIP)

finished …

The Job´s log

Let´s see in detail:

an ubuntu 18

an ubuntu 18

git checkout

Use node 12

npm install …. after a “cd” coman because I am no in the top level folder of GitHub

ok npm install

and Clean Up …

GitHub Action for the “Angular” build

So, this is the same, but with “npm run build”

 npm run build

last “build” … we needed to add the “cd” command again to change the dir ..

git push …

And last! the Green ball

we had a successful build

so, let´s finish the post here

we had a github repo with and Angular project

And now, we are able to build it on every push with GithHub actions

We got the idea … I hope so!

To the next one …

Pablo

Resources

https://github.com/Pabloin/Hack_Call4Code

https://github.com/Pabloin/Hack_Call4Code/actions