OpenAI’s ChatGPT is a powerful language model that can be used to create engaging chatbots, virtual assistants, and content generators. In this blog post, we will explore how to integrate ChatGPT into a Next.js application using the OpenAI Node.js library. We will provide example code to demonstrate how to make API requests and process responses […]
State management is a fundamental part of building React and Preact applications. The useState hook is the most common way to manage state in React components, but there’s a new kid on the block that’s worth considering: useSignal. useSignal is part of the @preact/signals library, which provides a way to manage state using reactive principles. […]
The lang attribute in HTML specifies the language of the content of a web page. It is important to have the lang attribute set correctly on a web page for the following reasons: Accessibility: The lang attribute helps screen readers and other assistive technologies identify the language of the content and read it correctly for […]
As a programmer, the terminal is an indispensable tool for managing files, executing commands, and automating tasks. Whether you’re working on a Linux, macOS, or Windows machine, the terminal provides a consistent interface for interacting with the underlying operating system. We’ll cover 20 essential terminal commands that every programmer should know. These commands are the […]
Passing props to props.children in a React functional component is a way of passing data down to multiple child components at once. The props.children property is a reference to the child elements that are contained within the component’s JSX tag. Here’s an example of how to pass props to props.children in a functional component: import […]
In today’s fast-paced digital world, users expect web pages to load quickly and efficiently. When making network requests, such as with the fetch API, it’s important to ensure that the request is only sent and processed when necessary. One common scenario where aborting a fetch request is important is when a user navigates away from […]
Scalable Vector Graphics (SVG) has become an essential part of modern web design, offering a wide range of features to create engaging and interactive graphics. One of these features is the "currentColor" fill option, which can simplify the process of changing the color of your graphics while maintaining a consistent look and feel. The "currentColor" […]
2 Years ago, I wrote a script to remove techInAsia paywall with google chrome extension, where you can download from my repository: https://github.com/maxlibin/nopaywalltechinasia/releases/tag/v0.03-1 Surprisely still works today 2023
When you doing git merge in terminal sometime you get annoyed by the default merge message editor that git provided, most of the time is in nano and sometime because you are so pro in vim editor you type too fast and accidently append the usual comands to nano. This annoyed me alot, so you […]
Recently I was reading some article and happened to came across this website https://www.startupsg.gov.sg, right is a website to showcase startups based in Singapore. In the website, there are a few directories such as startups, investors and profiles: https://www.startupsg.gov.sg/directory/startups/ As you can see the infos are protected on UI part, when you click disclosed funding […]
This is a guide on how to setup a web app with Go/GoLang, React and MongoDB Assuming you have already installed Go language and NodeJS in you machine. If not please install with the links above. A the time of writing I am using go version go1.14.2 darwin/amd64, and Nodejs v13.8.0 So the first thing […]
Alias git to pull current branch Git 2.22 onwards has a current branch flag, with git branch —show-current allows you to see which brach you are at now, sometime you want to pull current branch changes, and the easiest config in my opinion is to set a alias in your bash_profile or zshrc without messing […]
If you like to do a loop in bs-emotion for list of classes and do something, for example different background colors for class of name 1 – 10. .class_1 {background-color: …} .class_2 {background-color: …} .class_3 {background-color: …} .class_4 {background-color: …} here’s how: First you create a loop function with list of colors that you want […]
let%Anything is a really cool module for ReasonML, Which allows you to create a module and use as with let%Module, lets take a look how to use. Since buckleScript have upgraded to 7++ by default and I am using bs-let for demo: Create a module and method that you like, with let_. Here I create […]
I have added a demo on how I use ReasonMl/ReasonReact with expressJs and mongoDB, you can see how I use Atdgen for sharing types from frontend, reasonML and backend, expressjs/javascirpt types. You can see how I use bs-emotion instead of css, or sass to style the components. you can see the repo on: https://github.com/maxlibin/ParentalJobs This […]
Recently I was working quite a bit on ReasonML / ReasonReact projects, and we moved from writing old approach of writing external CSS to inline-css with bs-emotion (using oCaml syntax directly). Its really easy to use css or sass / scss into ReasonReact components, you can import them the same way you import with from […]
A higher order component is basically a reusable component which allows you to takes in another component and return a new component. To recap about higher component check our my older post here In ReasoML higher order function are called "Functors" which takes in a module type and returns a module type, functors are written […]
Recently I was working on some reasonml/ReasonReact project which required to request data in JSON format from an API endpoint, well there are some BuckleScript decoders such https://github.com/glennsl/bs-json which is the more popular one, the way you decode is pretty easy: point = { x: int, y: int }; let point = json => Json.Decode.{ […]
fast piping in reasonml fast piping allow you to transform your function code into more readable syntax, imaging you have human(person(age())) this is very inconvenience to see. with piping you can do it like this: age ->person ->human which is exactly the same as human(person(age())) there are 3 different pipes as I understand you can […]
Recently I converted one of my old React project while studying React from Udacity sometime back, Since I am reading ReasonML recently so I thought I might as well convert to ReasonML language or ReasonReact, you can find it here. MyRead ReasonReact
Imaging if you need to access deep level of property and you are not sure that if such properties exists deep down, you are doing something like books && books.book && books.book.authors && books.book.authors.author This is really difficult to read and understand sometime. there is something called optional chaining in javascript proposal which you can […]