Good day everyone!
This is my first article on Medium and the first time I share a technical thing in English. So there are some mistakes, but I’m trying to write it short and clear. Hope you can approach it well. Thank you for reading!

Before starting with the main content, I would like to introduce about my career. I started with the IT industry six years ago as a PHP Full-stack Developer. Since 2016, I have been working at Asian Tech, with a new role: Front-end team leader. I have strong knowledge and experience in pure Front-end (HTML/CSS/SASS) and JavaScript frameworks/libraries. My team is gaining more skills, practicing on the Back-end API side to become a Full-stack JS Engineer. So MEAN Stack is what we do and practice every day. …

Someone asked me the other days, how I’ve been doing code-review as a leader of a team. And there are key points that help me to do a good job in my time as a code-reviewer.

Image for post
Image for post

Make a coding guideline

Make a style guide, coding standards, and ask teammates to abide by the rule to avoid taking time for common things.

During my years in frontend development, I always try to find and apply best practices for every JavaScript framework/library I work on. And the idea to write this article originally came from my Angular topic:

On the topic above, we discussed how to control the content based on user status, about the DRY principle. Finally, I provided a solution to solve that issue by using Structural Directives.

Following the same line of thought, but let’s go forward to the other case study that is regularly required for good user experience, apply the same logic for each page request like this:

Higher-order component
Higher-order component
  • Show loading spinner while data processing/API fetching. …

Image for post
Image for post

Case study: Show contents based on User status

Let’s start with a simple requirement, show a welcome message on the home page after signing in.
To deal with that, you will:
1. Inject a service into the home component.
2. Define a function inside the home component that calls the method of the service.
3. Call this function in the template.

There is no problem if you use this only once. However, in fact, you might have to handle the user authentication at many places, for example, enable like button, show comment box for an article if user status is authenticated otherwise ask for sign-in... …

Image for post
Image for post

As you know, Angular is one of the most powerful JavaScript frameworks for building modern web applications. With Angular CLI, it easy to set up a new project with one command, it covers almost options for your application.

If you are new to Angular, see this official document to know how to config your workspace. Otherwise, let’s go forward to the main content of this topic that is how to deal with some advance requirements.
For example, provide different values of the Title, Google Tag Manager code in index.html for each environment.

Basically, duplicate the index.html

Good day everyone!

I come back after a long time and bring you a new package for your Angular application it’s named NgGolMap. To save your time, let's join a survey to identify whether you will be interested in it or not. Let’s answer some questions:

  • Have you ever work with Google Maps API?
  • Have you ever work with other maps such as Open Street Map?
  • Have you ever heard about Open Layers?
  • Are you going to build your GIS service with some specific data?

If you are in those things above, this article is for you, otherwise continuous reading too, you might get some helpful information such as How to create an Angular package, Module forRoot, Module forChild … throughout my article or it will help your project in the future. …

Vix Nguyen

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store