Author: smartcoder

AWS S3 File Upload using Fastify Multipart Example Code

Example code of File uploading to Amazon S3 using node fastify backend. Fastify uses Fastify multipart for image/ file uploading. Fastify Route - fileUpload.route.ts... Read more »

Mantine UI : Button Padding Change

How to customize button padding in Mantine UI Button component. Mantine UI core button padding customization code. styles={{ root: { padding: 5, margin: 0,... Read more »

Align Left Button Contents – Mantine UI Button

Align Left the contents in a button like icon, button text in mantine UI. Customizing Mantine button styles styles={{ inner: { justifyContent: 'flex-start' }... Read more »

Fastify Route, Handler, Service Codes

Fastify Route code server.get( "/googlelink/:id", { schema: { params: $Sref("idParamsSchema"), }, }, fetchGoogleUrlBySurveyIdHandler ); Fastify sample controller code export async function fetchGoogleUrlBySurveyIdHandler( request: FastifyRequest<{... Read more »

React TypeScript CheatSheet

Typescript cheat sheet for react functional components. useRef const divRef = useRef<HTMLDivElement>(null); setState const SkillSection = ({setScrollDuration} : {setScrollDuration: (value: number) => void}) =>... Read more »

Mantine UI – Notification with loader and update

Notify data update with notification - Mantine UI loader and then success or failure message notification with icons. Mantine Notification Loader icon and success... Read more »

Mantine UI : Custom style for mobile device

How to give custom css for mobile devices using mantine UI, React JS app example. import { useMediaQuery } from '@mantine/hooks'; function SelectLang({ languages,... Read more »

Next Router – Reference

Next JS Routing examples Router.push import React from 'react' import { useRouter } from "next/router"; const Members = () => { const router =... Read more »

Mantine UI – Search Box for React App Code

Search Box made with mantine ui code, Search Box and Share Button <Group> <Input icon={<IconSearch size={16} />} variant="filled" placeholder="Search responses" radius="xl" size="sm" styles={(theme) =>... Read more »

Mantine UI – Loader in Page Center

Loading icon in Mantine ui with react js const loaderStyle: React.CSSProperties = { position: 'fixed' as 'fixed', left: '50%', top: '50%', transform: 'translate(-50%, -50%)',... Read more »