Improving Code through Refactoring

Refactoring Code Steps

Step 1. Creating a Refactoring Branch

$ git checkout main // change to main branch
$ git pull origin main // make sure your main is up to date
$ git checkout -b refactoring // create a new topic branch

Step 2. Refactoring Code
Extracting a Function

• Find a duplicate codes and create a function that does the same.

Before

    try {
        const configPath: string = path.resolve(argv.config);
        if (!fs.existsSync(configPath)) {
            console.error(`${argv.config} does not exist`);
            process.exit(-1);
        }
        if (path.extname(configPath) !== '.toml') {
            console.error('Config file must be a .toml file');
            process.exit(-1);
        }
        const configOptions = TOML.parse(fs.readFileSync(configPath));
        selectedLang = configOptions.lang || 'en-CA';
        cssLink = configOptions.stylesheet || '';
    } catch (err: any) {
        console.error(err.message);
        process.exit(-1);
    }
} 

After

export function errorHandling(err: string) {
    console.error(err);
    process.exit(-1);
}

    try {
        const configPath: string = path.resolve(argv.config);
        if (!fs.existsSync(configPath)) {
            errorHandling(`${argv.config} does not exist`);
        }
        if (path.extname(configPath) !== '.toml') {
            errorHandling('Config file must be a .toml file');
        }
        const configOptions = TOML.parse(fs.readFileSync(configPath));
        selectedLang = configOptions.lang || 'en-CA';
        cssLink = configOptions.stylesheet || '';
    } catch (err: any) {
        errorHandling(err.message);
    }
} 

Code Splitting

• Separated command-line argument parsing from file parsing.

Before
Both command line parsing and file parsing method are implemented in one index.ts file.

After
--index.ts
--commandLineParser.ts
--fileParser.ts

Now, one file is separated to two files doing the exact same job.

Step 3. Rebasing and Squashing Before Merging
$ git rebase main -i
This command squash every commit into a single commit, which starts an interactive rebase.

  1 pick 5233318 extract errorHandling() function
  2 pick 164abe2 Added more testing files
  3 pick d5e66e6 removed empty line
  4 pick 4389ae2 code clean up
  5 pick 47f3ad7 added export to errorHandling() function
  6 pick e1ec6ea refactored to use exported errorHandling() function
  7 
  8 # Rebase 4e53e12..e1ec6ea onto 4e53e12 (6 commands)
  9 #
 10 # Commands:
 11 # p, pick <commit> = use commit
 ...

Squash the last 5 commits (squash) into the first (pick)

  1 pick 5233318 extract errorHandling() function
  2 squash 164abe2 Added more testing files
  3 squash d5e66e6 removed empty line
  4 squash 4389ae2 code clean up
  5 squash 47f3ad7 added export to errorHandling() function
  6 squash e1ec6ea refactored to use exported errorHandling() function

After saving, git creates a new commit using all commits in a single commit.

 ~/WebstormProjects/til_tracker $ git log                                                                                                                           
commit 5b8372868822aa26e11dcedfdf0645b229de3236 (HEAD -> refactoring)
Author: Avelyn Choi <[e-mail]>
Date:   Tue Oct 3 13:39:50 2023 -0400

    extract errorHandling() function

    Added more testing files

    removed empty line

    code clean up

    added export to errorHandling() function

    refactored to use exported errorHandling() function

Step 4. Amending a Commit
When we want to change our commit, we can do

$ git commit --amend // update previous commit
or 
$ git --amend --no-edit // update previous commit without changing commit message

$ git commit --amend

  1 extract errorHandling() function
  2  *Added more testing files
  3  *removed empty line
  4  *code clean up
  5  *added export to errorHandling() function
  6  *refactored to use exported errorHandling() function
  7 
  8 # Please enter the commit message for your changes. Lines starting
...

Make a change in your commit

 ~/WebstormProjects/til_tracker $ git log                                                                                                                                                        
commit 9211c0b69079552e4354451d2ad2038ef74c6c6a (HEAD -> refactoring)
Author: Avelyn Choi <[e-mail]>
Date:   Tue Oct 3 13:39:50 2023 -0400

    extract errorHandling() function
     *Added more testing files
     *removed empty line
     *code clean up
     *added export to errorHandling() function
     *refactored to use exported errorHandling() function

Step 5. Merging Our Work

$ git checkout main
$ git merge refactoring
$ git push origin main

You can find squashed commits from here: 9211c0b, 8f27109

Note: The second commit was added later, after the first commit had already been pushed to the main branch, in order to make further improvements.