OneBite.Dev - Coding blog in a bite size

🧑‍🚀 Latest posts on OneBite.dev

Read the latest blog posts on OneBite.dev, coding tips and trick in a bitesize.

Solving docker http:invalid host header in docker snap

My app was suddenly break. Not sure what to do, the only message I can see from the docker console logs is http invalid host header, here is how I solve it

docker

Web scraping with javascript (Easy step by step)

Learn web scraping with JavaScript through this easy step-by-step guide, and start extracting data from websites effortlessly and efficiently!

javascript scraping

FastAPI and PostgreSQL docker compose setup (simple version)

Here is how my minimal setup for fastAPI and PostgreSQL project using docker-compose for local development

fastapi docker

Faster ruby scraping program with threads

Learn how to make faster web scraping program with Ruby using Threads

ruby scraping

Hidden gems in google serp for SEO content

Explore overlooked Google SERP features for SEO insights: Autocomplete, Featured Snippets, Knowledge Graph, and Related Questions

SEO

Scraping google search result with Ruby (For free)

Learn how to scrape google search result with Ruby. Without any paid service!

ruby scraping

Web scraping with Ruby (for beginner 2023)

Beginner guide on how to scrape website content with Ruby

scraping ruby

Guide on web scraping with Ruby

Learn what tools and how to scrape a website with Ruby

ruby scraping

Install and run mongodb in Mac OS

How to install and run mongodb in mac with brew

mac mongodb

How to use mongodb in Rails application

Rails does not support nosql database out of the box. Here is how to use mongodb as database in Rails

rails mongodb

Render custom HTML, CSS and Javascript in Astro MDX files

Today I learn how to render custom HTML, CSS and Javascript in MDX Astro file. This is how you do it

astro

What is `set -e` in shell

The `set -e` option in a shell script instructs the shell to exit immediately if any command exits with a non-zero status.

bash

Astro error Expected ";" but found ":"

Here is how I solve error Expected ";" but found ":"

astro

How to add meilisearch in Laravel

Learn how to install meilisearch in your Laravel app. Make your search system smarter

search

How to add inline script in NextJS

here is How to add inline script in your NextJS project

nextjs

How to create a keyword ranking tracker SEO tool

This is how I build my own keyword SEO ranking tracker tool. Track how your ranking perform in Google

SEO

Astro Content collections Guide (For beginner 2023)

Managing contents in Astro (static site generator) is now more fun and safe with content collections

astro

How to load component once in astro mdx (auto import)

Auto import any component to your mdx files. Set the component once and use it everywhere!

astro

Move a file to a different folder in Github

How to move file to a different folder in Github.

github

How to create an SEO content research tool

This is how I build my own SEO research tool. It's great for writing a new content and want to make it top rank fast

SEO

How to create your own SEO tool

Introduction post on how to create our own search engine optimization (SEO) tools like ahrefs, semrush, Ubersuggest) and so on!

SEO sharing

Select all new line in VS Code (shotcut)

Here is how you can directly select all new line (or end of line) in VS Code text editor

vscode

run code program on terminal every x time (seconds)

In order to run any command or program every X seconds or any time from your Mac terminal, you can utilize a shell loop with the sleep command.

mac terminal bash

Auto expand textarea with Javascript as you type

Here is how you can expand or grow your textarea if the content is already more than current height while typing

javascript

Access route without authentication in Django rest framework

How to access a route without authentication in Django rest framework, when the best setting has DEFAULT_PERMISSION_CLASSES

django-rest-framework

Solve sharp installation_error darwin-x64 install yarn error

This is how I Solve sharp installation_error darwin-x64 install yarn error on mac os x

nodejs

How to prevent block or forbidden on Newspaper3k scraping

How to bypass blocked or forbidden to accessed content when scraping with Newspaper3K in python

scraping python

Different column name on using ModelSerializer in Django Rest Framework

How to solve different column name upon using ModelSerializer and Class Meta in Django Rest Framework

django-rest-framework

How to Use Tailwind CSS in React JS

Step-by-step guide on integrating Tailwind CSS into a React project. From setting up a new React app, installing and configuring Tailwind CSS, to writing your first component with Tailwind classes

tailwind react

How to adjust row gap in a grid at Tailwind CSS

Learn how to adjust the row gap in a grid layout using Tailwind CSS. This guide covers the use of gap utilities, creating responsive row gaps, and real code examples for hands-on understanding

tailwind

How to Center a Div in Tailwind CSS (Multiple Ways!)

Master the techniques of centering a div in Tailwind CSS, both horizontally and vertically. This guide provides practical examples using Flexbox and Grid layout utilities for precise element positioning

tailwind

How to Create a Navigation Bar with Tailwind CSS

Step-by-step guide to create a responsive navigation bar using Tailwind CSS. From setting up Tailwind CSS, creating a basic nav bar structure, to making it responsive and adding interactivity.

tailwind

How to revert or rollback migration in Django

Learn how to revert migrations in Django. This guide includes steps for reverting all or specific migrations and cautions to prevent data loss

django

Solving AttributeError: 'module' object has no attribute 'celery' in Django

Here is how to solve Solving AttributeError: 'module' object has no attribute 'celery' in python or when celery not found

django celery python

How to cd (change directory) inside docker compose

Here is how you can CD into your app inside a running docker compose program that need to be executed

docker

Connect database on app and GUI for Laravel Sail

Using Laravel Sail? here is how you can connect to your mysql database to your app or GUI like tableplus

laravel

Laravel vite manifest not found on deployment

How to solve error Laravel vite manifest not found on deployment

laravel

Target class controller not found laravel

How to solve error Target class controller not found in Laravel project

laravel

How to properly deploy Nova at Laravel Forge

Here is how you can add Nova to your fresh Laravel project that deployed via Forge

laravel

Get value response json from other funtion in Laravel

Here is how in Laravel if you need to get the value of response that returned json from local function

laravel

Verify only 1 edit action required to string in Javascript

The problem is to check if two strings are one (or zero) edits away. A javascript sample solution for this common interview problem.

javascript

Check if a string is palindrome permutation in Javascript

. In a palindrome, characters have to appear in pairs for the string to be mirrored around the center, except possibly for one character. Here is the javascript solution

javascript

Check if two strings is anagram on javascript

Here is how to solve the interview question for Check if two strings is anagram on javascript

javascript

Determine if all string has unique characters in Javascript

Determine if a string has all unique characters, you can use a Set in JavaScript. See case sensitive and insensitive version.

javascript

Chunking array buy n number in javascript

The array chunking problem is another common interview question. The goal is to divide an array into smaller sub-arrays (chunks), where each chunk is of size n

javascript

fizz buzz program sample in javascript

The FizzBuzz problem is a classic coding interview question. Here is sample program and how to solve it

javascript

How to find the maximum character in a string in javascript

javascript

How to check if string is Palindrome in Javascript

Checking if a string is a palindrome (same when reversed) in javascript. Also handling white space chars.

javascript

Check array only contains unique value javascript

How to verify array is only contains unique value in Javascript. Answer is using Set!

javascript

Renew SSL certificate Let's encrypt after Laravel Forge expired

When your subscription expired at Laravel forge, don't forget to reassign SSL certificate manually from your server

laravel devops

Convert data from jsonb postgres to array Javascript

Here is how to Convert data from jsonb postgres to array Javascript

PostgreSQL javascript

Solving prisma error running on docker linux-musl

When running prisma inside a docker on my mac m1, it shows those error, here is how I solve it

prisma

Docker compose setup for traefik https using cloudflare DNS resolver

When using cloudflare as my dns, traefik did not work as expected when using it on docker compose. Here is how I solve it

traefik devops

Using highlightJS for code syntax in Astro

Today I faced a problem, where Laravel shows empty results when query a relation with eager loading. Found the solution, it was I forgot to select the id as well, so the relation didn't know what connects the second table with.

astro

How to load external script in Astro

Require is not defined! How I solve loading external javascript library in Astro that uses a require to load module inside it.

astro

find and replace text in VS Code using regex

Here is how to find a certain text on VSCODE using regular expression and replace it with anything you want using part of the text before

vscode

Render different component in react conditionally

How to render different components based on value or conditionally in ReactJS without using switch case since that's not available

react

understand useRef in React with simple example

what is useRef in Reactjs, when is it useful to use? what is the different with declaring normal variable in React

react

What's the difference between bit and byte

TLDR A bit is the smallest unit of digital data, while a byte is a group of 8 bits. It is used as a basic unit of measurement for the amount of data in computer systems

computer

Migrating Hugo site to Astro

A long time Hugo fans here. I still struggle on doing query, routing or filtering. I tried Astro and really love it. Here is how you can migrate too

astro hugo

Solve docker django could not connect to server Connection refused postgre

Here is how I solve docker issue when running django could not connect to server Connection refused connecting to postgre database

docker

Hugo vs Astro - which static site generator to choose in 2023

Which static site generator to choose in year 2023? should you pick the newcomer Astro or Hugo that been here for a while

astro hugo

Hugo shortcode in Astro Components

Migrating my site from Hugo to Astro, requires me to find out what is a Hugo shortcode relevant in Astro statice site generator

astro

How to solve docker containers can not be down or stopped or removed - permission denied error

How to solve docker containers can not be down or stopped or removed caused by permission denied error

docker

How to auto delete files in AWS s3 every X times interval in Nodejs

Here is how you can auto delete files from certain bucker in AWS s3 storage every X times interval in Nodejs, whether less than a day, an hour or any time you choose

aws

I don't know what to write on my blog - developer

Blog about little new things you discover, if it's new to you, it may also be new to others

content-creation

How to auto answer yes or no question when installing with apt in docker

When running a docker image, sometimes we need to install a package that requires us to answering a yes and no question. But docker will exit because of this

docker linux

Learn the art of teaching dev from these people

list of people who are amazing at delivering dev/programming content

content-creation

Updating poetry package manager from 1.1 to 1.2 1.3 or above

I got a problem when try to update my poetry package manager from 1.1 to 1.2 1.3 or above. Here is how I solve it

python

Solve poetry problem: configuration is invalid properties group was unexpected

Here is how I solve my poetry python configuration problem, where Additional properties are not allowed (group was unexpected) issue

python

How to create a new file in astro

To create a new file in astro site generator, we just need to create a new file inside pages folder with .astro extension

astro

react developer tools guide 2023

This is a simple guide on how to use react developer tools in browser like chrome, firefox or safari to help us, debug and inspect: components, props and state

react tool

HTML code snippet with emmet

make your life easier as frontend developer, by using emmet as your HTML code snippet. By installing meet, you can write HTML code much much faster

HTML tool

You can ask AI, what is the output of the following code snippet ...

AI-powered tools can predict the output of code snippets, saving developers time & effort. However, it's important to review & test the code manually as AI is not perfect

AI tool

What is code snippet meaning

Learn about code snippets, small pieces of code that serve specific purposes & can save time for developers. Discover where to find them & how to use them

tool

Import function from another file in NodeJS without module

If you need to add an external function from other file into a nodejs file without changing the type into module type you can use this commonJS method

javascript nodejs

How many programming languages should I know

How many programming languages should you learn is a normal question to ask when you just beginning your journey in programming world. Here is my take

softskill

What is serverless and why it is important?

Serverless computing allows developers to write and deploy code without worrying about underlying infrastructure, leading to cost savings, scalability, flexibility, and security. However, it can also result in vendor lock-in and difficulties in debugging.

serverless

What is code review and why it's important?

Code review is an essential part of the software development process, as it helps ensure that your code is of high quality and meets the needs of your project

softskill

What is Coding tools

Coding tools can greatly improve your productivity and efficiency as a developer. From beginners to experienced programmers, it's worth exploring and trying out different tools to find the ones that suit your needs best

tool

How to solve Unable to locate file in Vite manifest app sass at deploy

I got an error that says Unable to locate file in Vite manifest: resources/sass/app.sass when deploying my laravel app - here is how I solve it

laravel vite

Empty folder not copied to docker - folder not found on production

If your empty folder not copied to docker while on production and you getting error folder not found - here is how I solve it

docker

Print X number of docker logs

Here is how to print certain amount of logs on docker. It is helpful for me to debug what is happening recently

docker

Mocking next router on Jest test

How to mock the next router on Jest test function to be able to past query when rendering a component in React or nextjs App

testing jest

Git error push remote branch src refspec does not match any

If you got error - src refspec does not match any, failed to push some refs to...- when trying to push change to remote git branch, here is how I solve it

git

Create a local branch from existing remote branch

If you want to test remote branch locally, you can use fetch method on git to try it on your machine

git

Install multiple fonts on docker images

Looking for a way on how to install multiple fonts on your docker images? here is how I did it

docker

Passing children on React component results in error objects are not valid as a React child

How to solve error objects are not valid as a React child when passing a children into nested React Component

react

Put conditional logic onClick ReactJs

If you need a different behavior of your on click action in ReactJS, depend on if else logic you have, try this

react

Why is it like that

During debugging my app, I jump between solutions until I found what I want. But I forget to ask what causing the behavior in the first place.

debug softskill

How to learn new skills while having a job as a programmer

When and what to study on the side. Studying part-time is great because it can give you more flexibility to pursue your dreams without compromising your career goals.

softskill study

Case sensitive when multiple select - cursor on VS Code

I often found myself selecting multiple variable on VSCode, but the problem is, it is case insensitive. Today I learn how to make it case sensitive

vscode text-editor

My cypress setting to run with GUI or not

Sometimes you want to see your test running with GUI, but sometimes not, you just want run CLI and see the test results. Here is my package json setup

cypress testing

Disable video recording when running Cypress

How to Disable video recording when running Cypress run test on you project

cypress testing

Should you write an automated test for your code?

Many developers feel like writing tests is a waste of time because they do not see the immediate benefits. Here is benefits when we write an automated test for our code.

testing

How to solve Error jest-haste-map Watchman crawl failed.

Here is the solution on how to solve Error: jest-haste-map: Watchman crawl failed. Retrying once with node crawler when running Jest Test

testing jest

Rotation on a previously rotated page on PDF-lib not correctly handled

I found a problem where rotating on a previously rotated page on PDF-lib is not correctly handled. Here is how I solved it

pdf-lib

removing page in PDF-lib show error index must be at least x

removing page in PDF-lib show error index must be at least x and at most x , but actually... assertRange error. Here is how to solve this

pdf-lib

Run block of code each time before certain test in Cypress

Do you need to run same code / function each time running a test? We can automate it with beforeach

cypress testing

Waiting for element exists in Cypress instead of time

Here is how to wait for a certain element until exists in Cypress instead of time

cypress testing

A (fake) conversation between the best programmer in the world with a junior

This is a fake conversation between the best programmer in the world with a junior generated with Artificial intelligence (AI)

softskill

How to choose the best developer tools for your needs

A new developer's guide to choosing the best tools, frameworks, and languages. It's important to do your research before making a decision.

softskill

Dragging item on mobile also scrolling the parent

When working with dragging library like interactjs, I got a problem with mobile devices. Where scrolling get buggy and moving the parent as well

javascript

Shortcut bash function to review Github Pull Request locally

This is my Shortcut bash function to review Github Pull Request locally faster

git bash

How to have a hover effect on children when parent is hovered in Tailwind

Learn how to have a hover effect on children when parent is hovered in Tailwind CSS. Luckily, this case is already covered, no hacky-way needed

tailwind

Nested multiple condition on ReactJS

How to have a multiple if else condition in ReactJS template that depends on multiple set state variable or just in general

react

How to add word space in tailwind CSS

Is there any way to have a word space in tailwind? Yes, this is useful if you want to have a distance / space between word

tailwind

Async await function not working in forEach loop Javascript

This is a quick solve on how to handle async await function not working in forEach loop Javascript

javascript

How to add and remove another git remote repository

You have an origin remote repository for your git. But you need to add other remote repository. Lets see how to do this

git

How to make zoom effect in HTML with CSS

Learn how to make zoom effect in HTML with CSS. We will play with scale transformation on CSS to make the element chosen bigger/smaller

HTML CSS javascript

How to declare type in Object destructuring typescript

Learn how to declare type in typescript when using Object destructuring in Javascript

typescript

How to declare object property type in typescript

Lets learn How to declare object property type in typescript using interface

typescript

Declare possible values of string in typescript

How to declare possible values of string in typescript. So we get an error if the provided parameter is wrong or have a typo?

typescript

What is type for onClick event in reactJS using typescript

What is the correct type when using onClick event in reactJS using typescript

react typescript

How to resolve Option --resolveJsonModule cannot be specified without node module resolution strategy.ts

This is how to resolve Option '--resolveJsonModule' cannot be specified without 'node' module resolution strategy.ts error on typescript tsconfig.json file

typescript

How to use typescript in existing NextJS project

I already have a running NextJS project but I want to start using typescript. Lets see how to add typescript in existing NextJS project

nextjs typescript

Add class name based on ternary operator result in ReactJS

Lets see how we can add a class name based on ternary operator result in ReactJS. Whether a single class name or multiple class names.

react

Play with Image generation tool: MidJourney, Dall-E 2 and Stable Diffusion (DreamStudio)

I was stunned, the first time I saw Dall-E 2. I really want to use it. While waiting for the beta invitation. I got my hand on other image generation, and here is my experience so far.

image-generation

Solve Too many re-renders. React limits the number of renders to prevent an infinite loop

I got an error on my react app says: Too many re-renders. React limits the number of renders to prevent an infinite loop. How can I solve this?

react

Solve state variable react can not be read in addEventListener function

Today I learned, that we can't access the variable inside addEventListener function we manually write for an element in React, Javascript

react

How to get x and y coordinate position when clicking on javascript

Learn How to get x and y coordinate position when firing on click event at javascript

javascript

How to use Toast UI Editor in Browser (without NPM)

Are you looking for great markdown WYSIWYG text editor? Try toast UI Editor, lets see how to use it directly in browser

toastUI javascript

Super simple Zoom image vanilla javascript medium like

I need an ability to zoom images on my site. Luckily I found this javascript plugin by Tholman that very easy to use.

javascript

How to solve Cannot use import statement outside a module error

This is How to solve Cannot use import statement outside a module error when running a nodejs application

nodejs

Allow scroll through top iTerm mac

If you print or log bunch of data in Terminal (Iterm) normally, you can't scroll back to your latest command. Here is how to do it

terminal mac

Find list of developer tools with FindDevTools

Are you looking for a list of developer tools for your next project? FindDevTools is the answer. We can compare between tool , see it feature and pricing.

tool

Error Laravel Please make sure the PHP Redis extension is installed and enabled

Encountered this error? Error Laravel Please make sure the PHP Redis extension is installed and enabled. Lets see how to solve it

redis laravel

Solve Class Redis not found on Laravel project

Do you encounter error Class Redis not found on Laravel project and looking for a solution how to resolve this bug?

redis laravel

Sort Javascript Object Value by the number or date

Do you need to sort your object by one of the key value by the number? start from highest or lowest number? We can use javascript sort function fort that. Here is how

javascript

Sort javascript Object value alphabetically

Do you need to sort your object by one of the key value alphabetically? We can use javascript sort function fort that. Here is how

javascript

Prisma error when doing upsert

When implementing upsert through Prisma you need to make sure that the where clause contains a unique column only

prisma

Auto Scroll page in Javascript

Do you have a really long page that you wish will scroll down automatically using javascript? or do you want to make this as feature for your website visitor?

javascript

Checkout remote pull request on Github and run locally

If you need to review someones pull request from Github and run the project locally. Check out this guide

git

How to test pull request locally

You're assigned to review your teammate's code from remote git repository. But rather than just reviewing it directly in Github, you want to run it locally first. Here's how

git

How to Install Laravel on Mac OS

Learn How to Install Laravel on Mac OS, by using brew and installing PHP, composer and mysql (if you need mysql)

laravel mac

Get uuid from a link string in python

Learn how to get UUID from a string link on a python programming language. This could be useful for example when you are working with Notion site then need to grab the id

python

Solving Error: pg_config executable not found psycopg2 install

On my mac machine, I tried to install a new python library with psycopg2 in it, I got pg_config error, here's how I solve this error

python

How to add multiple types in pydantic

To allow pydantic to accept multiple values we can use Union

python

How to allow local certificates in Postman?

When you have self assigned certificate in your computer and want to allow Postman to access it, you need to add the certificate from your trusted store

SSL postman

How to make bcrypt checkpw function work

If you're using bcrypt in python, and try to use checkpw but keep failing, probably you save the hashed password in database wrong. Here's how I solve it.

python

Solve alembic multiple head revisions are present

Just like git, When you have multiple branches on your migrations of sqlalchemy's alembic. It will tell you that you have two different versions that need to be solved.

python

How to convert sqlalchemy object to json in FastAPI

Have you struggled on How to convert sqlalchemy object to json in FastAPI? Do you know that fastapi has jsonable_encoder to do exactly this job?

fastapi python

Solve error Alembic Can't locate revision identified by id_number

If you're using Alembic as your migration tool for sqlalchemy project on your python program, you might encountered this problem before -Alembic Can't locate revision identified by id_number- here's how to solve it.

python

How to bulk update in sqlalchemy python?

Update multiple columns one by one is daunting. Learn how to do a bulk update on Sqlalchemy in python programing language to update multiple items at once.

python

Convert string to UUID format in Javascript

This is how to convert a 32 characters string into UUID format with - dash as separator on each 8 - 4 - 4 - 4 - 12 characters.

javascript

Laravel empty relation when eager loading

Today I faced a problem, where Laravel shows empty results when query a relation with eager loading. Found the solution, it was I forgot to select the id as well, so the relation didn't know what connects the second table with.

laravel

Solving the Next.js Head problem that auto parse HTML entity

I want to share how I finally solved the Next.js Head problem that auto parse HTML entity. In my case, I want to remove & (ampersand sign) being encoded by Next.js Head.

nextjs react

Start using mongo shell in docker

Simple guide on how to Start using mongo shell in docker. We just need to take the mongo's docker name and run it as interactive shell.

docker

How to install meilisearch in ubuntu for production?

Learn how to install meilisearch in ubuntu for production. This guide will tell you how to add meilisearch search engine on same server where your app runs.

search

Remove all unsaved / uncommitted changes in github

See how to Remove all unsaved / uncommitted changes in github. In case you make some changes, and want to get back to the last commit you have

git

Connect Production Docker PostgreSQL In TablePlus/SequelPro

Tips on how to connect production Docker PostgreSQL using database GUI TablePlus or sequelpro. Hope it works for you as well

database PostgreSQL

Connect Localhost Docker PostgreSQL in TablePlus

Tips on how to connect Localhost Docker PostgreSQL using database GUI TablePlus or sequelpro

database PostgreSQL

Traits in Rust

Learn what is Traits in Rust. Tutorial on how to implement Traits in Rust programming language. It's similar to interfaces in other languages

rust

What is Lifetime in Rust?

Understand What is Lifetime in Rust? what error a lifetime could cause and how to solve this problem

rust

Generic Types in Rust

Learn what is Generic Types in Rust. Tutorial on how to implement Generic Types in Rust programming language

rust

Hash Map in Rust

Learn what is Hash Map in Rust. Tutorial on how to use Hash Map, the key value pair collection in Rust

rust

Vector: collection in Rust

Vector can be used to storing lists of values in Rust. It's one of the collection that included in standard library in Rust

rust

Collections data structure in Rust

Learn about Collections data structure in Rust. What collections is available and how to use it

rust

If and let in Rust Control flow

When there are many possible values, but we only care about one in a control flow, we can use if and let syntax in rust.

rust

Match control flow in Rust

There is one more powerful control flow in Rust, which is match. It's pretty straightforward, we would return a value based on match condition

rust

The Option Enum in Rust, null alternative

Rust didn't have a null value. But there is an Enum Option that can implement null behavior

rust

Enums in Rust

Learn what is enums in Rust programming language. How to use enums and when to use it

rust

Struct Method in Rust

How to add a method on a struct in Rust. If we do have a special repeatable task for a struct, it's better to put it, in it's own function

rust

Struct data type in Rust

Learn what is Struct data type in Rust? How to use structure data type in Rust programming language

rust

Slice data type in Rust

Learn about Slice data type in Rust. It's a reference for sequence of elements in a collection

rust

References in Rust

This is part of the ownership lesson in Rust. References is a cheap way to use other variable on other function without passing the whole value

rust

Understand the stack and the heap

What is stack and what is heap in term of memory allocating in programming language?

rust computer

What is ownership in Rust

Understand what is ownership in Rust. Ownership enables Rust to make memory safety guarantees without needing a garbage collector.

rust

Looping in Rust

Learn how to loop a program in Rust, using for, loop, and while. It's part of the control flow process

rust

Variable Scope in Rust

Understand the variable scope in Rust. This is an important part so we can learn how Rust allocating their memory later

rust

Conditional statement in Rust

Learn how to implement a Conditional statement in Rust. Using if and else. We can also use just one line if else to declare variable

rust

String in Rust

String in Rust might be more complex than you think. When people talk about string, it can have multiple meaning

rust

Function in Rust

What is a function in Rust? Learn how to declare and user a function in Rust.

rust

Data types in Rust

What are available data types in Rust ? It also has two subsets: a scalar data type and a compound data type, including array and tuples

rust

Declare a variable in Rust and mutability

Learn how to declare a variable in Rust. Also see what is mutable and immutable variable

rust

What is Cargo in Rust

Cargo is Rust's build system and package manager. It's an optional tool, but it handles a lot of tasks to work with Rust

rust

Hello World in Rust

Write our Hello World in Rust. It requires compiling and running

rust

Getting started with Rust, installation

Let's set up our Rust development environment. We will use Rustup / Cargo as our installer and package manager.

rust

I start learning Rust

I always see posts about Rust on dev-related blogs. I don't have the motivation to learn about it, as I heard it's built for complex project. Maybe I can use this blog to motivate me.

rust

Hover effect on 5 star rating systems

This is my solution on how to make a Hover effect on 5 star rating systems

javascript

Solve Unexpected end of JSON input while parsing near... on NPM install

Yesterday when my internet really slow, I keep failed on installing npm package. The error shows npm ERR! Unexpected end of JSON input while parsing near .....

npm

Add Browser Sync in Gulpjs Project

How can we auto reload pages when certain changes happen? we can combine the power of browser sync and gulpjs

gulpjs

Watch Tasks in Gulpjs

Learn how to watch Tasks in Gulpjs so the files can reload themselves when certain task triggered

gulpjs

Combine Tasks in Gulpjs With Parallel Function

Learn how to Combine Tasks in Gulpjs With Parallel and Series Function as your tasks grow

gulpjs

Compress image with GulpJS

Learn how to compress multiple images with GulpJS, we don't need any extra tools for this, just run our gulp tasks

gulpjs

Combine Multiple Javascript (JS) Files With GulpJS

Learn how to combine Multiple Javascript (JS) Files With GulpJS. Sometimes we want to separate our javascript file during development process to make it easy for use to maintain it. But in production we still want to only serve one file for faster request time.

gulpjs

Minify CSS files with Gulp JS

Learn how to Minify CSS files with Gulp JS to make it load faster

gulpjs

Simple jquery like selector for vanilla javascript

jQuery make us love javascript. One of the simplest but most useful feature for me is the selector in jquery, just use $ dollar sign and target the element. Let's make it happen in our vanilla javascript

javascript

Working with object in localstorage

We all love localstorage, no database needed to store simple things for our user. But what if the data is more than a string or number? How to store and read object in localstorage?

javascript

Combine multiple CSS files with GulpJS

Learn how to combine multiple CSS files into one file with GulpJS, it's useful to make sure our HTML will only request for one file later (reduce request time)

gulpjs

GulpJS introduction, how to install

This post will be an introduction post on GulpJS. A toolkit to automate & enhance your workflow Leverage gulp and the flexibility of JavaScript to automate slow, repetitive workflows and compose them into efficient build pipelines.

gulpjs

Display or filter a list of post based on a category or tag in Hugo

Learn how to display a list of post based on a category or tags in Hugo . This is not for normal category page, since Hugo will sorted it out for you out of the box. This is for when you want to display certain list on a random page

hugo

Display categories or tag on meta data Hugo inside head tag

Yesterday I struggle with displaying a list of categories or tags inside a head tag of my Hugo project. I want to use this on my meta tag to make it more dynamic a.k.a better for SEO.

hugo

How to concatenate string on hugo SSG

quick tips on How to concatenate string on hugo SSG or how to combine string with variable on gohugo

hugo

Solve Warning: REMOTE HOST IDENTIFICATION HAS CHANGED

You can't access your remote host? and the error WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED or IT IS POSSIBLE THAT SOMEONE IS DOING SOMETHING NASTY shows up? this is how to solve it

unix shell

Create Open Graph Image generator, introducing imagin.live

We need an image for each of our blog post to make it stand out on social media. But generating for each one for our post is not fun. That's why you'll love Imagin. It's a post about how I make Imagin, dynamic open graph image generator

nodejs vue hackathon

How to remove last commit on github

It's just happened to me yesterday, where I push something to main branch, but not the main branch that I want. I start panicking and looking for help how to undo my last commit before anyone see the changes

git

Introduce Row Level Security in Supabase

Supabase has a row level security that useful for protecting our data. Even though we're using anon key publicly or in client side, it's still safe as long as we enable the row level security for that particular table

supabase

Basic of Authentication in Supabase using email invitation

Supabase provides an authentications system for us out of the box. We can use it as user management. It has third party logins (social login) and row level security for security. We'll take a look of example using simple email invitation

supabase

Play with Supabase database in website with Javascript

Learn how to create and read Supabase database via it's API with Javascript on a website. We will use in browser javascript to load the data and display it on our HTML page.

supabase

Explore table editor in Supabase database

Exploring table editor for managing database in Supabase. It's like an app that has Graphical User Interface (GUI) where we can do something intuitively without knowing any SQL. Supabase's database is built on top of Postgres, an extremely scalable relational Database. We can use the SQL editor or Table Mode which makes it like spreadsheet

supabase

Setting up new @Supabase Project

Let's see how to start a new project on supabase. And we'll see overview of what we can do on our supabase dahsboard

supabase

Introducing Supabase, your everything for backend

Introducing Supabase, the open source firebase alternative. We can create a backend for our project really fast. Start your project with a Postgres Database, Authentication, instant APIs, realtime subscriptions and Storage with a beautiful dashboard.

supabase

How to update useState value based on new value reactjs

Learn how to update useState value based on new value reactjs. I encountered a problem, where I can't manipulate newest addition on my array that using useState in react

react

Call method only once in useEffect react

Be careful when using useEffect in React. it can bring unintentional behavior you don't want, like calling API multiple times

react

Series of article in Hugo website

Learn how to add series for your article in Hugo. This way we can group multiple post on a certain topic or series

hugo

Show future post in Hugo SSG

How to display future post in Hugo. We will see how you can render between published post and future post in hugo static site generator

hugo

Solve root can't access server after change password in digital ocean

Learn how to solve when root user can't access server after change new password in digital ocean. You already change new password but still can't access root

server devops

Handy collection of linux command

List of collection of linux command

unix shell

Moodle site: The session partition is full error [unsolved]

How to solve The session partition is full error on moodle site or when your disk is full

moodle

Solution for preflight CORS issue in serverless function

This is how you can solve preflight CORS issue in vercel serverless function when building API in nodejs

serverless nodejs vercel

Handling API request based on method in Vercel Nodejs

Learn how to handle API request based on method, example GET, POST, PUT or DELETE request in Vercel Nodejs serverless function

serverless nodejs vercel

Nodejs serverless function in vercel

Learn how to deploy and write nodejs serverless function in vercel platform for free

serverless nodejs vercel

Create simple deploy script

Learn how to create a simple deploy script, to automate your code deployment when using git or any other things in command

bash productivity git

How to add _blank or open new tab for link in markdown

Can we add _blank property or open new tab for our links in markdown? is there any way around it

markdown javascript

Debug javascript in iphone device

Learn how to debug javascript of your website in iphone device from your mac to see console result error or warning

debug javascript

Hello World

Hi, introducing onebite.dev

sharing

Write HTML dynamically with mini SSG

Using mini SSG to write reusable components, layout and partial code in HTML files

SSG HTML open-source

How to improve your skill as a developer

AI generated content on How to improve your skill as a developer made by copyai and edited by me

sharing open-source

On building freestuff.dev

reason why I start building freestuff.dev

sharing open-source

How to backup database or Laravel App

Learn How to backup database on Laravel App. Remember to always backup your database, never underestimate what happen tomorrow

laravel

Add live search in Hugo website

How to add search functionality in your Hugo static website. It's a bit tricky, but not that hard

vue hugo

Migrate from firebase to Hugo

I want to migrate my firebase site (data stored in firestore) to Hugo posts. The problem is hugo made with files not database per se. Here is how i convert or migrate from firebase to hugo markdown to create post

database firebase hugo

Read json file with random key in Go Lang

How to read a json file that has a dynamic or random key in Go language. We'll use the map data type to solve this

go

How to get random collection /data in firebase firestore

Learn How to get random collection /data in firebase firestore

firebase

How to upload image / file in firebase with progress bar

Learn how to upload image or any file in firebase with progress bar to show how many percent your data already uploaded

firebase

How to solve firebase.database is not a function

for new firebase user who start to play with firebase database it's possible you meet with this firebase.database is not a function error

firebase

How to custom style momentum chrome extensions

Chrome extensions is just like other program, it's inside your computer after downloaded, so you can customize it too

sharing

How to upgrade firebase cloud function to node 8

Learn how to upgrade your firebase project that using cloud function to node version 8

firebase

Create future post for firebase blog

Let's learn how to make a scheduled, future post for your blog which made with firebase

firebase

How to add HTML content inside sweetalert box

Here is how you can add html content or html tag inside your sweetalert box

javascript

My experience learning android with kotlin from web development background

I'd like to share my experince as a web developer to try learn how to make an android app with kotlin

kotlin

How to optimize laravel app with caching config, route and view

How to optimize laravel app with caching route and config. All it's done by simple one-line command

laravel

Filter data by interval time (between) in mysql

oftentimes we need to filter or select data in mysql by the interval time

sql database

Update text between two words in mysql

How to get and update text between two words in mysql. We can use the replace method and combine in with normal Where clause

sql database

How to fix Amazon S3 error RequestTimeTooSkewed

Suddenly one of my s3 function i use normally got an error with message RequestTimeTooSkewed. Here is how to fix it

tool AWS s3

How to consume API in Vue with Axios

Learn how to consume and display data from an API with Axios package in Vuejs

api vue

Why do we need to save created_at and update_at field in database

What is created_at and update_at field in database? why do we need to add this fields in our database?

database

How to export firebase firestore database for free

How to export firebase firestore database for free

firebase

How to count most used words in database with python

How to count most used words in a sentence or article with python programming language

python

Manage media/image in forestry with cloudinary

How to manage your static website's media like hugo via forestry with image hosting provider like cloudinary

tool hugo

Using forestry as CMS for your Hugo site

We need to make our blogging experience as fun and easy as possible, content management system might help us to do that

hugo

How to Customize Front Matter in Hugo

Learn how to customize you pre-defined fields in front matter in your hugo app

hugo

How to Make Dynamic Twitter Card for Hugo

Hot to make a nice dynamic twitter card in Hugo to optimize our twitter post

hugo

How to Create Simple Pagination in Hugo

How to create simple next and previous button for your website's pagination in Hugo

hugo

How to Include JQuery via Inspect Console

How can you include a jquery for website that didn't use it via javascript console or inspect element

jquery

What Is Bash and How It Can Save Your Time

Have you heard about bash? but not sure what does bash actually do? Let's see how it can save you r time.. a lot

bash productivity

Create New Hugo Post Faster With Bash

How to create new hugo post faster with bash script? without writing hugo new command anymore

bash hugo productivity

Move My Hugo Site From Github Pages to Netlify

Today i move my static site using hugo from github-pages to netlify hosting provider

sharing hugo

How to Schedule Post in Future for Hugo

How to set hugo post schedule in the future with netlify and cron task

hugo tool

Mac Shortcut to Improve Productivity

Some mac's shortcut to improve your productivity while working with mac

mac productivity

How to Tweet Your Blog Post Automatically

How to tweet your blog content automatically via RSS by schedule that you define yourself

tool productivity

Free and Easy Rest API for Prototype

How to make an API free for prototyping your app without writing any backend code or setup a server

api tool

How to Get All Hugo Tags

How to get all hugo tags or taxonomy or category you use for your static website

hugo

How to Draw Image in Html Canvas

Let's learn how to draw an image with HTML canvas. We'll see how to upload image and draw it or browse it on our machine's library

html javascript canvas

Where to Host Website for Free

Is there any place to host your website for free? short answer is YES, long answer.. YEEEEEEES

tool

How to Be More Productive With Atom

There are many things you can do with atom text editor to make you more productive

atom productivity text-editor

My Atom Recommended Packages

What's your favorite atom packages? here is some of my atom recommended packages

atom text-editor

How to Make Custom Atom Snippet

How to make a custom atom's snippet, to make your coding time more productive

atom productivity text-editor

How to Create Dark Mode in Website

Learn how to create a dark mode website for your website. It's actually easier that you think

html css javascript

How to Draw Text in Html Canvas

Let's learn how to draw a text with HTML canvas

html javascript canvas

How to Deploy and Host Hugo in Github Pages

How to deploy your hugo website and Host it for free in Github Pages

hugo

Simple Hugo Blogging Site

How to make a simple hugo website for blogging with tagging or category system.

hugo

How to Create Poster With HTML Canvas

Learn how to make a poster with html canvas, in this example we will make a poster for making a quoter for instagram post

html javascript canvas