All Posts

Adam C. |
In this article, we will learn how to deploy FeathersJS to the Node server along with the Apache server using Reverse Proxy. The PM2 is also used to easily start/stop the application.
Adam C. |
The right way to move your existing code to Github Repository, so it shows the correct user name. Also, you should make sure only to check in the files you wanted by using .gitigonore. Furthermore, use SSH instead of HTTPS, so you don't need to log in every time you push or pull.
Adam C. |
ES6 Modules give us a lot of freedom, so then we can write functions in a different module. An ES6 module is a file containing JS code, and we can import and export it in modules. In this article, l will show you how to share the variables among ES6 Modules, which I think it's an alternate way to do closure in ES6 Modules.
Adam C. |
Learning how to connect to some public Wifi, like Vacation House/Library/Hotel, etc. which requires login / accepting Terms and Conditions. This usually is straightforward, because most phones will open the page automatically after entering the Wifi password, but on some devices, it may drive you crazy, like Macbook or Kindle Fire tablet. This post will show you how to get to the Wifi login page.
Adam C. |
NVM is a great tool to manage different version of NodeJS installed on your computer. Either you want to upgrade to the latest NodeJS, or just switch from different versions as project needed, it comes in handy. But sometime it would be confused that you already use the version you pick in nvm, but VS Code is still using a different version. It's easy to fix only if you know how to.
Adam C. |
In this article, we learned how to fix the 'failed to fetch' error from API-Gateway in our AWS Lambda Serverless Framework. The root cause is ended up to be the expired AWS Cognito Access/ID tokens. We were able to fix this by utilizing the Apollo Error Link to replace the old token with the refreshed one, and then retry the request.
Adam C. |
Recently I migrated MongoDB (over 2GB) from a cheap server hosted on Hudson Valley Host to a better server hosted on Digital Ocean to improve the performance. In this article, I would like to write down some notes for this process.
Adam C. |
We have a serverless application running on AWS Lambda. Recently, we saw some warnings/errors in the AWS CodeBuild log as below, although the application is successfully built: provider.apiGateway.shouldStartNameWithService and gypErr. In the article, we will explain the issues and solutions.
Adam C. |
React is usually used to build a single page application, which means you only load the application code (HTML, CSS, Javascript) once. It works perfectly for a small application, but for a complex application, to load all Javascript code into a bundle (i.e., main.js) could cause the initial page loading to become very slow. So when you find that your app has a performance issue, the first thing you should try is code-splitting.
Adam C. |
Updating NPM seems to be very easy. Running 'ncu -u' followed by 'npm install', we can have all our dependencies up to date. However, updating packages without checking breaking changes is very dangerous. I could not find any easy solution, but suggest doing this often and testing your app thoroughly.
Adam C. |
NoSQLBooster is probably the best free MongoDB GUI tool. We have been used to import CSV data into a MongoDB collection for a while, which works very well. But we got the error when importing JSON data. That might sound very weird, doesn't it? It ends up because we did not provide the "correct" JSON format. Let's see what JSON format to make NoSQLBooster happy.
Adam C. |
Apollo Client 3.0 includes some breaking changes, but since the Apollo Boost project is now retired, and React-Apollo has been deprecated, it's time to migrate. But Apollo Client 3.0 is mainly focusing on Hooks when being used in the React project. If your React project is not Hook ready yet, you may be wondering it's possible to use Apollo Client 3 with React Class Components or not. In short, the answer is YES.
Adam C. |
NextFeathers uses JSON web token (JWT) for authentication when calling the Restful API implemented by FeathersJS. The JWT token was simply saved in the browser's localStorage and removed when the user is logged out. Many people said this is very bad because the hacker could run Javascript via what so-called XSS on your website, and read the data from localStorage. Personally, I kinda against this because it's unlikely happened, and as I know that is how AWS-amplify works by default. But there is indeed a risk, so I would like to fix it.
Adam C. |
In this article, we will learn how to easily convert CSV files into a Restful API using FeathersJS Command Line and MongoDB. We will also learn how to cast data type using FeatherJS hook.
Adam C. |
AWS provides us Amazon Cognito User Pools, which could be used as authorizer to control access to our application. The article will explain all three tokens implemented by Cognito User Pools, and discuss some common questions of how to use those tokens.
Adam C. |
useEffect is complicated compared to useState. Maybe because it handles three states together: componentDidMount, componentDidUpdate, componentWillUnmount. In this article, we will look into all threes together to understand how useEffect hook works.
Adam C. |
There are two possible reasons that your React component renders twice. One is that your component is not a pure component and its parent re-renders after it's initial rendering. The other is that you are using React.StrictMode, which could cause double rendering in the development mode.
Adam C. |
Different from CKEditor 4, you cannot edit the source code to add whatever HTML code to the content you are editing in CKEditor 5. But sometimes, we do want to have a bit more control over the content generated by CKEditor. Good news, we have "ckeditor5-build-classic-dna" came with a plugin to allow us to add custom CSS classes to <table> and <img>.
Adam C. |
In this article, we would like to share some issues we had and resolved during setting up AWS Lambda to use Amazon RDS Proxy.
Adam C. |
Semantic-UI is probably the only Modern UI that does not offer Responsive Navigation Bar. I created the NPM package: dna-responsive-nav to fix this limitation. If you are using Semantic-UI-React, then you may give it a try.