3 Dev hacks for Angular developers to make your work life easier

Naguib (Nick) ihab
naguibihab
Published in
4 min readSep 13, 2017

“A lazy developer is a good developer” — wise man

Don’t you just love it when the computer is smart enough to do the mundane stuff for you? If you’re a fan of automation and you’re working on a windows computer, then this article is for you.

Hack #1 Batch files

A simple click and your code is being built, copied, deployed, invalidated for you. Batch files are fantastic for writing quick and straightforward code that would run git/grunt/aws commands for you.

Checkout this useful git repository that contains all the batch files that I use on a daily basis for my Angular & PHP development

Here’s an example of one of my favourite and most used batch files where it pulls a branch that I specify, does a bower install, builds it, then copies it into a location where my peers can see it and opens a browser tab pointing to that location:

REM ****************************************************************
REM I use that bat file when someone asks me to build them a particular branch
REM it goes to the secondary source code (in case i'm in the middle of something
REM and don't want to commit or stash) fetches from git, checksout the branch
REM pulls it by force (it will overwrite any uncommitted changes but that folder
REM shouldn't be used to write code anyway) installs any new dependencies from
REM bower and then builds and copies that build to my xampp folder where I
REM have a local ip address pointing to it so others on the same network can see
REM it and test it. Eventually it opens a new browser tab with that url.
REM
REM If you're working remotely and want to upload the code to a server checkout
REM the batch file "CheckoutBuildUpload" which uploads to S3
REM
REM prerequisits: git, bower, grunt
REM **************************************************************
::setup
if "%isSetupCalled%" equ "" (
call ../SetupEnv.bat
)
set _human_or_batch=%1
set _isPause=%isPause%
::inputs
:: check if its called by human or by another batch file
if "%_human_or_batch%" equ "" (
set /P _branch_name=Branch:
goto defaults
)
:: else, get the inputs from the parameters
set _branch_name=%1
set _isPause=false
::defaults
:defaults
:: No defaults in that file, but I'm keeping that for consistency
::operations
echo moving to %frontend_directory%:%frontend_secondary_source_code%
%frontend_directory%:
cd %frontend_secondary_source_code%
echo getting branch %_branch_name%
call git fetch --all
call git checkout %_branch_name% --force
call git pull --force
echo building...
call bower install
call grunt build
xcopy "%build_file%" "%base_destination%\%_branch_name%" /s/e/c/y/fstart "" %base_url%/%_branch_name%if %_isPause% equ true pause

Hack #2 Automatically starting up your apps

I used to have my computer sleep everyday instead of shutting it down because I have more than ten applications open and I just don’t want to have to open them all up again the next day, that’s not so good for the computer though and it ends up slowing it down. The solution, using windows’ Startup Menu.

  • Open the cmd and run shell:startup
  • Create a shortcut for each application you’re using or any batch files that you use often (i.e. to open git for my projects) and throw it in there
  • You can even add in batch files for stuff like:
    - opening and pulling the latest from git in all projects
    - running grunt-serve for your frontend application
    - compiling/building your application

Hack #3 Git hooks

Git can have hooks attached to it that would do a job before or after you commit or push.
The one that I use the most is a hook that appends my branch name to the my commit message.

For example if I commit a new change while on branch nick-testing

git hook

That git hook appends my branch name to that start of my commit message

git hook

This comes in handy when you’re working with Jira where commits that contain the jira task id are seen on the console

Here’s how you can add that nice little handy hook to your git repositories:

  • Navigate to the hooks folder /.git/hooks in your repository
  • Copy this code in a new file:
#!/bin/sh
#
# Automatically adds branch name and branch description to every commit message.
#
NAME=$(git branch | grep '*' | sed 's/* //')
DESCRIPTION=$(git config branch."$NAME".description)
echo "YourProject-$NAME"': '$(cat "$1") > "$1"
if [ -n "$DESCRIPTION" ]
then
echo "" >> "$1"
echo $DESCRIPTION >> "$1"
fi
  • Change the YourProject- part to your jira project name or completely remove it if you’re not using jira
  • Save that file as prepare-commit-msg

Now any new commit made will contain the branch name.

Thanks for reading!

If you enjoyed this article, feel free to hit that clap button below 👏 to help others find it!

--

--

Naguib (Nick) ihab
naguibihab

Just another coder with some free time and a coffee on a train 🚈 ☕️ 👨‍💻