Skip to main content

Coding Standard

 

Starting...

This lab is to help our codes to standardize automatically. As you have experienced a lot, group coding is very difficult to be unified in one specific style. In this lab, we will explore how to make one style code with very efficient or effective libraries, prettier and lint for node js.

Progressing...

Prettier, link, is great for matching our coding style especially indent with tab or space, how many line and so on. The first step I took is to install prettier and put simple scripts in package.json,  "prettier-fix": "prettier --write \"./**/*.{md,js,json}\"", "prettier": "prettier --check \"./**/*.{md,js,json}\"". I just run the script and I realized that there were a lot of prettier issues like indent, different ending style, tab, space and so on. Luckily, these scripts were very helpful since it provided auto editing features as well so I did not have to modify following the rules manually. 

Eslint, link, is also great tool for more small mistakes of developers. It is more complicated to install since there are many plugin to adopt. For example, I chose airbnb's rules for it, https://github.com/airbnb/javascript. To be honest, I don't like it for a small project, but I believe for a big one, it will be very helpful because there are so many restrictions like below. I had to add a lot of exceptions into eslintrc.js and in real development world, I should not.

I think it is more powerful than prettier. Because of it, I could modify small mistakes like useless escape, strong equal and so on and it didn't provide auto-modification feature since the error is more complicated so I spent a lot of time for it.

VSCode, one of famous IDE, also provides Prettier - Code formatter nad Eslint as extensions. Once I install them, they also provide a guide to set up eslint and prettier. So, I set up the configs in .vscode folder.

Finally, I set the pre-hook for commit since any developer can forget to run the prettier or eslint script. For this feature, I install husky and lint-staged.

Concluding...

You maybe have experienced that it was very difficult to handle with other programmers' coding style and at least one person had to handle with all of different coding style before submission of team project. Now, I have learned from this lab about how to set up coding standard, which is great for team projects. So, everybody is happy. 

Comments

Popular posts from this blog

Working with telescope

   Starting... This lab is to help students to communicate with a big project, telescope, and understanding how to handle with the set it up. There were a lot of trouble since many of technologies are new for me such as docker, docker-compose, elastic search ladis, pino, and so on. Let's jump in the big project . Progressing... The first step I took is to install wsl 2. It is not very difficult since microsoft provides good instruction, link . Although the telescope provides very good instruction,   here , It was not really easy for me to get a concept and set it up successfully. Therefore, I needed to ask a lot of questions on slack, telescope channel. Some helped me a lot and explained so much and finally I got it work successfully.  After my server was working locally, I didn't have any issue to get the response from the url, http://localhost:3000/posts.  To communicate with the local server, actually I needed to change my code a lot since I wanted to sp...

Getting more difficult?

  Release 0.2.4 Now I am at almost the end of release 0.2 and I chose the telescope as the final contribution. To be honest, this is huge, well organized and great project and it is first time to take a look. Unlike my previous assignment during the previous terms, there are tons of what I have never seen. First, docker compose is great and the document for contribution is very clear. Of course, I had no idea when read it first, but every time as my professor mentioned, there was a great guy, helper?, helping me a lot to set up the project. Although I had no idea about Elastic-search and Redis-cache server, I was happy to take a time to look though the codes and to understand. Again, trying to understand an issue is always hard for me and sometimes I am really not happy when somebody does not understand my question. This happened again. The reason why I attached the picture is that I am still confused about the whole process of this project especially about why frontend didn't get ...

Elastic search and more

  Release 0.3.1 Now it is time to learn what is Elastic search since the chosen issue is about adding more fields for our model in telescope.  This is very new for me so I was very scared when I started to work for this but now I think I am more confident. First, Elastic search is such a great supportive database especially for index search. The good thing is that it is not only the index search for whole value but, partial keyword as well. Of course, it may be wrong since I also just started to study it. Anyway, It was very careful when I read codes one line by one. Following the official document ,  I tried to add some fields, but it made some test failed so I needed to fix them. The below content is from the official document: Mapping edit Mapping is the process of defining how a document, and the fields it contains, are stored and indexed. For instance, use mappings to define: which string fields should be treated as full text fields. which fields contain numbers, dat...