Merge pull request #12 from ShishirH/patch-1

Clean up terminal story description

Author: krushiraj

portfolio/content/writings/mini-terminal-story/index.mdx

@@ -14,18 +14,18 @@ technologies: "javascript,vue"
 
 ## How did it all start?
 
-I wanted to build a portfolio site for myself. I started looking at various popular portfolios that I found by searching here and there. I decided on how my portfolio would look like and I also had a finalized design for my portfolio in my head. But, I wanted to make something which would be part of my portfolio and which also would showcase my skills in Data Structures, Algorithms and using Front-end frameworks. Prior to this I worked on some proprietary frontend framework by ServiceNow, which was made by picking best of both worlds from React and Vue. I had some prior experience working with React but I never worked with Vue. So I decided to work on Vue for this. My goal was to build a webpage whsich would mock a terminal and file system in a computer. Also, I didn't want to use any ready made helper libraries or packages to mock the terminal. So I decide to handle the key press events by myself and mock an editor. Only elements that were used in making this webpage were div, span and p.
+I wanted to build a portfolio site for myself, and to differentiate myself from the other popular portfolios found online, I decided to make something which also would showcase my skills in Data Structures, Algorithms and Front-end frameworks. I had some prior experience working with React but none with Vue. So I resolved to work on Vue for this. My goal was to build a webpage whsich would simulate a terminal and file system in a computer. Also, I didn't want to use any helper libraries or packages to make the terminal. I handled the key press events myself to create an editor. Only elements that were used in creating this webpage were div, span and p.
 
 ## The UI building blocks
 
-First I decided on what components to build. I realised that I should have a container which would handle the key press events. The other components were ReadOnlyText section and EditableText section. So in a CLI based terminal you just have text, which is mostly read only and few parts are editable. This editable text will be converted to ReadOnly once we hit 'return/enter' key to execute the commands we give. So those were the base components on which the whole page was built.
+First I decided on what components to build. I realised that I should have a container which would handle the key press events. The other components were ReadOnlyText section and EditableText section. In a CLI based terminal you just have text, which is mostly read-only and few parts are editable. This editable text will be converted to ReadOnly once we hit 'return/enter' key to execute the commands we give.
 
 ## The internals that give life to UI
 
-I have implemented a tree with node similar to inode to mock the file-system. I wrote a generic parser and executor components which will parse the text and pass the parsed text as token, which contain some meta data to the executor. The executor will identify the command and execute the function that maps to command. In this way we can have any number of commands and functionalities added with ease in future. Everything was built as generic as possible to extend the capabilities and functionalities with ease. Auto complete suggestions feature was implemented based on the meta data that I had in an object. This is where I have mappings to command names, functions, help text and meta related to arguments and options. This helped me to implement the help command and built a Trie for autocompletion feature.
+I implemented a tree with node similar to inode to mock the file-system. I wrote a generic parser and executor components which will parse the text and pass the parsed text as token, which contain some meta data to the executor. The executor will identify the command and execute the function that maps to command. In this way we can have any number of commands and functionalities added with ease in future. Everything was built as generic as possible to extend the capabilities and functionalities with ease. Auto complete suggestions feature was implemented based on the meta data that I had in an object. This is where I have mappings to command names, functions, help text and meta related to arguments and options. This helped me to implement the help command and built a Trie for autocompletion feature.
 
 ## Summing up
 
-That was a great experience for me building this because it required me to put in more than one skill to build whole webpage. My thought to showcase my proficiency in different skills was perfectly potrayed with this webpage because it  required skills like implementation of different and complex data structures, writing algorithms which are efficient and optimal, understanding how Vue components work and communication between the components in the DOM heirarchy, exploring things in JS and CSS.
+That was a great experience for me building this because it required me to put in more than one skill to build the entire webpage. My thought to showcase my proficiency in different skills was perfectly potrayed with this webpage because it  required skills like implementation of different and complex data structures, writing algorithms which are efficient and optimal, understanding how Vue components work and communication between the components in the DOM heirarchy, exploring things in JS and CSS.
 
 So, that's how the Mini Terminal was built and the story behind it.