How To Dev

Introduction NextJS is a powerful React framework that enables developers to build high-performance web applications with features like Server-Side Rendering (SSR) and Static Site Generation (SSG). Key advantages include improved SEO, automatic code splitting for faster page loads, a built-in routing system, and an optimized developer experience with "Fast Refresh" and easy deployment through platforms like Vercel. Prerequisites NextJS framework is primarily used for building web applications based on ReactJS and is supported with many more features, so if you only have a need to create a Single Page Web Application or have never started with React , you should look up some basic knowledge before continuing with the posts in this series. Detail Using styled-components in Next Applications Understanding React Server Component Guide to Setting Up Jest Testing for a NextJS Project AWS Guide to deploying NextJS on AWS ECS Guide to Setting Up CI/CD for NextJS with Jenkins, Gitlab,...

Introduction In this article, I will guide you on adding Jest (currently the most popular testing library) to test for projects using the NextJS framework. This integration helps developers automate the source code testing process, from logical functions (Unit Testing) to user interface testing (Integration Testing) in the Node.js environment. Here are the prominent advantages: Fast and effective: Jest runs tests in parallel, saving significant time as the project scales. Built-in Support: Next.js provides the next/jest configuration, making setup extremely simple, automatically handling CSS files, images, and framework-specific features. Excellent Watch Mode: Jest has the ability to detect recently changed files and only run related tests, keeping the development workflow smooth. Coverage Reports: This tool has built-in capability to statistic the percentage of source code tested, helping you assess application quality and reliability visually. Rich ecosystem: When combined with React...

Introduction In the previous article, I provided instructions on using NestJS with JWT, and you may also realize that if you use JWT, once a token is issued, it cannot be revoked. This means that if you have a token that hasn't expired yet, you can continue to use the service. For small systems that do not prioritize security, this might not be a major issue and can be simply resolved by deleting the token from the frontend when the user logs out. However, if you need to build a system with extremely high security, where the token must be invalidated upon logout so that no one can use it to access the service, this article will guide you through how to achieve that. To do this, we will use Redis (which I have already guided you on in this article) to store tokens that have not expired but are requested to be deleted. The storage duration for these tokens will be exactly the time remaining until they expire. Thus, after applying Redis, the operation of tokens will be as follows: If ...

Introduction Python is a high-level, general-purpose programming language with exceptionally clear and readable syntax, designed to optimize programmer productivity. Some outstanding advantages of Python include: Easy to learn and use: Its syntax, which resembles English, helps beginners quickly get accustomed. Rich libraries: Possesses a massive ecosystem of libraries supporting everything from web development, data analysis, to artificial intelligence. Cross-platform: Can run on Windows, macOS, and Linux without needing to change the source code. Strong community: Has widespread support from a global community of developers, making error resolution easier. Detail Guide to Managing Python Environments with pyenv and Poetry Using mlx-lm to run local LLM Deploying a Python Flask Server to Google Kubernetes Engine Happy coding!

Introduction Angular is a TypeScript-based, open-source web application framework developed by Google, widely used for building dynamic and feature-rich single-page applications (SPAs). Advantages Two-way data binding: Synchronizes data between the view and model seamlessly. Component-based architecture: Enhances code reusability and maintainability. Built-in tools: Offers robust features like dependency injection, directives, and routing. Community support: Benefits from an active developer community and regular updates from Google. Disadvantages Steep learning curve: Requires understanding of TypeScript, RxJS, and other Angular concepts. Complexity: Can be overwhelming for smaller projects due to its size and structure. Performance issues: May face challenges with performance in very large applications. Key features Here are the key features of Angular that I will introduce in this series: Lifecycle Hooks: A set of methods triggered throughout a component’s lifecycle—from creation to...