Refactoring with Git
Tags: opensource, github, javascript, html
Published: 2021-10-15 03:07:55

This is the __6th Week__ that I've been being in __OSD 600__. And this week we have a new work to do -- __Lab 5__. _Different from_ the previous labs we had, this week we are going to __modify__ our code of SSG program and make it __looks better__. It's about __refactoring__ our code.

_Due to we added new features to our program, the complexity of the code grows with it. We added new features and we forced to create new code paths, functions, variables. which will cause we are start losing control of the code._
__Refactoring__ is a technique for improving the structure and maintainability of our code without altering its behavior.
<br>
##Procedure 
#### #1. Get the repository to my PC
After reading the __instruction__ of the __Lab 5__. I __cloned__ my repository to my _local machine_ and then used the command `git checkout -b refactor` in git to created a new branch named __'refactor'__. 
And then I use the command `code . ` to run the code in __Visual Studio Code__.

#### #2. Go through the code
_When my SSG code available in my local machine. I read through my code again. And I found out that there are a bunch of code are similar_. 
__Therefore__, I decided to make some __new functions__ to _reduce the amount of duplication_.

#### #3. Create Functions
__Firstly__, I created a function called __"mdFileHtmlConversion"__ to store the code that adding a new _feature_ to my SSG so that all `---` in a Markdown file would get converted to an `<hr>` tag.
__Secondly__, I found that the way I try to convert a `txt` file to a `html` file is very __similar__ the way I covert a `md` file to a `html` file. 
Therefore, I put then into a new function named __"htmlGenerator"__.
__Lastly__, I have duplicated logic and code for my program to convert `a folder` and `a single file`. In order to make my program with __less duplication__. I created a new function named __"htmlConversion"__ to _store the converting logic and code_.

#### #4. Improve variable naming
Since I updated my code with some __new functions__, it became __more tidy__. And my next step was to __rename__ those variables that with a _non-sense name_. For example, I have a variable named __'fname'__. I mean, there are many possibilities for a variable named __'fname'__, it could be __'first name'__ or __'file name'__ or __'french name'__, etc. So, I changed it to a more specific name __'fileName'__. It's way _more clear_ than with the name 'fname'.Also, I changed the variable __'stats'__ to __'filePath'__ so that it became easier to understand.

#### #5. Get rid of global variables
__Finally__, I _removed_ all the `global variables` I had in my code. Instead of having global variables, I put those variables to each __specific function__ that _I will use them_.

#### #6. Combine my commits
After updating my code, I use this command `git rebase master -i` to start an interactive rebase, and opening the editor. And then I overwrite the `'pick'` keyword to `'squash'` so that I can combine all the commits I had into __1 commit__. Then I use the command `git commit --amend` to rename some of my __commit descriptions__. Last but not least, I __merged__ my 'refactor' branch to my 'master' branch.
<br>
##My Feelings
I gotta say __"Refactoring is interesting!"__ This is a good way to improve my coding structure. It saved me __53__ lines of code after refactoring,![tips](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6szhlibfw1m7fe1qd8wd.png)which is almost __1/5__ line of code in my __SSG program__. 
Also, my code became easier to work with, easier to understand, and easier to extend! I think I will make more refactor move in the future!

Link to my repo: [[Refactoring]](https://github.com/DerekJxy/My-First-SSG/commit/48515f1a2fcd3e21f926df2106406685518842e6)