Avikant's Site
© avikantz, 2022

Tech (9)

Oh look, another tech blog...

Cover image for Reordering Items with Drag and Drop in React
Reordering Items with Drag and Drop in React
TECH2 months ago
A quick tutorial on how to implement reordering (in a grid or otherwise) using drag and drop in modern React functional components with hooks.
typescript
react
drag-drop
Cover image for Serverless Forms with Google Sheets
Serverless Forms with Google Sheets
TECH3 months ago
Webforms on a static, serverless site can be difficult to implement on your own. For ease of use you could opt for one of the paid website form services, or spend a few minutes connecting it with a google sheet (or forms).
sheets
forms
serverless
Cover image for Mapping macOS Keyboard Layout on Windows
Mapping macOS Keyboard Layout on Windows
TECH3 months ago
The main modifier (control) key placement on windows keyboards is unpleasant at best. Switching to a windows keyboard after years on a macOS keyboard layout is painful. Luckily you can get some of the macOS keybinds on Windows with some tools.
macOS
windows
keyboard
Cover image for Simple Ringtones on iPhone
Simple Ringtones on iPhone
TECH4 months ago
Syncing ringtones on an iPhone is ridiculously hard for some reason. However you can export any audio (or video) file from the interwebs into a ringtone using Garageband. This simple guide will shows you how.
iphone
apple
ringtones
Cover image for Custom SVG Icons with FontAwesome in React
Custom SVG Icons with FontAwesome in React
TECH4 months ago
Used FontAwesome for a project during prototyping, but now designers want you to use their icons? Here's how to quickly add custom icons to the already awesome Font library.
fontawesome
react
svg
icons
Cover image for SVGs as Components in React
SVGs as Components in React
TECH4 months ago
Vector graphics can be used as React components allowing extensive customizability by means of props. Here's how to create a SVG component in React.
react
svg
components
Cover image for Full Stack File Management Part II: The Frontend
Full Stack File Management Part II: The Frontend
TECH5 months ago
Every full stack developer would need to implement file uploads, downloads and access control at some point in their projects. This handy guide explores implementation of all aspects of file management, with part II focusing on UI and client side things.
javascript
react.js
next.js
Cover image for Full Stack File Management Part I: The Backend
Full Stack File Management Part I: The Backend
TECH5 months ago
Every full stack developer would need to implement file uploads, downloads and access control at some point in their projects. This handy guide explores implementation of all aspects of file management, with Part I focusing on data, backend and server side things.
javascript
node.js
mongodb
Cover image for Deploying a Next.js Application on Express
Deploying a Next.js Application on Express
TECH6 months ago
Next.js is a fast, scalable framework for React Applications, supporting Hybrid Static and Server Renders. While it's made for static deployments on Vercel, it works very well with any existing server (e.g. express) you may have. This shows you how.
react
next
express