Elwin's Blog

The modern approach on responsive design

Posted on July 27, 2022

Internationalization:

Logical properties

Instead of writing margin-left, using margin-inline-start to refers to the margin on the left side of a content box in a left-to-right language, and the margin on the right side of a content box in a right-to-left language.

There are more logical properties that can be

web React Javascript

The modern static analysis tools for Javascript

Posted on June 26, 2022

I've done on setting up a boilerplate project with 4 statistic analysis tools for React framework(using create-react-app), you can find it out here.

The tools included in the project are:

Eslint (mainly used to check code errors)
Prettier (a code formatter with little configuration rules )
Stylelint (checking on style...

web Javascript

OWASP Top 10 security risk on 2021 for front-end

Posted on May 31, 2022

The complete list of the description and prevention of each security vulnerability can be found here.

Now let's look at each one more closely:

A01:Broken Access Control

Common ones include the following:

CWE-200: Exposure of Sensitive Information to an Unauthorized Actor
CWE-201: Insertion of Sensitive Information Into Sent Data

Javascript

Notes on using Typescript: with design pattern

Posted on October 7, 2021

I have been using Typescript for some time, but still feels something absent on learning it, then I notice that beyond the basic syntax, I'm not familiar with the design pattern of Typescript. Sure, It's not actually a language, but since it's so widely used in my work, I feel that I should invest more time in learning the advanced usage of it.

I'll start from the definition...

Javascript

Implement a MinHeap in Javascript

Posted on January 29, 2022

It's useful when looking for a subset with certain quality in a stream, like Kth largest Element or Kth smallest Element.

The keypoint is understand how to get the parent index when bubble up, and left child index and right child index when trickle down, below is the implementation with comments:

Javascript

The fast track on learning the coding algorithms

Posted on July 5, 2021

When starting my career as a software engineer, I felt overwhelmed by the algorithms, I didn't even know what is Big O. Knowing it will take lots of time to learn it, I try to avoid it.

After spending a year to get myself familiar with Javascript, I know that it's the foundation of computer science, not specific to any programming language, which means once I learned the concept, I don't have to

web React

Avoid triggering multiple times on a useEffect when changing multiple state

Posted on June 27, 2021

For example:

You have a useEffect that watches the event_id and the date_range, they are separate states from useState.

when one of them changes, it will re-query a list of events.

The user can change the event_id from a list of events, the user can also change the date_range by using the date picker.

Somehow, you got a new request that when an active event_id is changed, the...

web Javascript

The Fundamental Of Coding Interview Question part 5 (Javascript)

Posted on October 7, 2021

Sorting and Searching

Thanks for https://www.bigocheatsheet.com/ for building this compact cheat sheet...

web Javascript

The Fundamental Of Coding Interview Question part 4 (Javascript)

Posted on June 13, 2021

System Design and Scalability

this section is more related to the back-end than the front-end, but it's good to know from a broader view:

Communication: it's more important in the system design than dealing with a specific coding algorithm question. because most of the time, a lot of details won't be covered in the problem description, so the candidate should ...

Javascript

The Fundamental Of Coding Interview Question part 3 (Javascript)

Posted on May 30, 2021

Recusrion and Dynamic Programming(DP)

Ways to approach:

Bottom-up: Starting from the simplest case, then build a solution that on top of the previous one.
Top-Down: The reverse of Bottom-up, less intuitive, but sometimes useful.
Half-Half: They are usually seen on the bitwise operation and binary tree operation.

DP & memoization:

Using recursion alone sometimes is...