Software architect. Web Development, build apps with Angular, TypeScript, JavaScript, and NestJS
Reading Time: 5 minutes NestJS has out of box integration with TypeORM, a TypeScript and JavaScript ORM that has good support of PostgreSQL. The library offers decorators to model data types and entities and tools to generate migration scripts to update database schema; therefore, it is a popular choice to perform CRUD operations. TypeORM offers custom repository that allows … Read more
Reading Time: 2 minutes We use NestJS at work and the backend project needs to perform date calculations and formatting in the services. Our team chose momentJS because it is the one of the most popular date-time open source project. After a while, we discovered that the library size is huge (~290kb) and it is not tree-shakable. If I … Read more
Reading Time: 2 minutes I completed Angular Architect Training Course from Bonnie Brennan at Angular Nation and lesson 1 is about style and structure. Even though the tips are for Angular application but a couple of them applies to NestJS. One of them is to void fat libraries such as lodash and moment. In this post, I am going … Read more
Reading Time: < 1 minute Intention: I am learning Spanish from a Spanish teacher and I cannot read my own notes due to my horrible handwriting. My resolution is to build a full-stack app to store new Spanish vocabulary. Stack: PANNG (Prisma, Angular, NestJS, Nx, GraphQL) Repo: https://github.com/railsstudent/nx-apollo-angular-course Characteristics: Nx Monorepo GraphQL module in Nest Apollo GraphQL Angular Apollo TypeScript … Read more
Reading Time: 2 minutes Generate a personal access token and create ACCESS_TOKEN variable under Settings -> Secrets. Keep the personal access token in a safe place and do not lose it npm script commands Add script commands “build” and “clean” to build application and generate artifacts in dist/ directory Run “npm run build” to build static application before deployment … Read more
Reading Time: 2 minutes Generate a personal access token and create ACCESS_TOKEN variable under Settings -> Secrets. Keep the personal access token in a safe place and do not lose it Fix 404 not found when page is refreshed My React app uses Reach Router library to route user from root / to /countries/:language. When I refreshes page with … Read more
Reading Time: < 1 minute Set up Apollo Client for React npm install apollo/client and graphql Create client.tsx file to store configuration of apollo-client react import ApolloClient, InMemoryCache and HttpLink from ‘@apollo/client’ Initialize and export an instance of ApolloClient Test client instance in client.tsx by executing a GraphQL query Create a new folder named graphql and add get-languages.tsx in it … Read more
Reading Time: 2 minutes Create a folder ts-graphql-country and change to directory Generate package.json Add “browserslist”: [ “last 2 Chrome versions” ] in package.json Install react, react-dom and @reach/router Install parcel bundler and prettier Add dev script in package.json to launch web site at http://localhost:1234 Create a blank index.html in src folder Create .prettierrc file to store prettier configurations … Read more
Reading Time: < 1 minute Create two divs and convert them into flexboxes. 2. Add .left-diag:after pseudo element to draw a black dialog line that draws from bottom left to upper right. Sass style is shown below: 3. Add .right-diag:after pseudo element to draw a black dialog line that draws from bottom right to upper left. Sass style is shown … Read more
Reading Time: 2 minutes Generate a personal access token and create ACCESS_TOKEN variable under Settings -> Secrets. Keep the personal access token in a safe place and do not lose it Go to Actions tab of the github repo Create netlify.yml under .github/workflow Paste the follow code in the yaml file I deploy the Tic Tac Toe game to … Read more