Skip to content

Instantly share code, notes, and snippets.

View VithuJey's full-sized avatar
🚀
To the up!

Vithushan Jey VithuJey

🚀
To the up!
View GitHub Profile
/*
* Stripe WebGl Gradient Animation
* All Credits to Stripe.com
* ScrollObserver functionality to disable animation when not scrolled into view has been disabled and
* commented out for now.
* https://kevinhufnagl.com
*/
//Converting colors to proper format
function normalizeColor(hexCode) {
@VithuJey
VithuJey / route.jsx
Last active October 22, 2021 06:26
Just a gist to explain React Router
<Route path="/search" children={<Search />} />
...
<Link to={`/search?category=${cat}&bundle=${bund}`}>Search</Link>
...
let location = useLocation();
console.log(location)
/*
{
pathname: '/search',
@VithuJey
VithuJey / userPermission.ts
Created October 21, 2021 15:42
Just a gist on localStorage
function userPermission({ userID: string }) {
const res = await fetch(`https://api.amazon.com/user/${userID}`);
const userPermission = await res.json();
localStorage.setItem("userPermission", JSON.stringify(userPermission));
}
@VithuJey
VithuJey / DeliveryForm.jsx
Created October 21, 2021 15:34
Just a gist to explain React Hook Form (RHF)
export default function DeliveryForm() {
const { register, handleSubmit, formState: { errors } } = useForm();
const onSubmit = data => console.log(data);
return (
<form onSubmit={handleSubmit(onSubmit)}>
<input placeholder="Full Name" {...register("fullName")} />
<input placeholder="Delivery Address" {...register("deliveryAddress", { required: true })} />
@VithuJey
VithuJey / Products.jsx
Last active October 21, 2021 15:26
Just a gist to explain React Query
function ProductList() {
const getProducts = async () => {
const res = await fetch("https://api.amazon.com/products");
const products = await res.json();
return products;
};
const { data, isLoading, isError, error } = useQuery("productList", getProducts);
if (isLoading) return "Loading...";
@VithuJey
VithuJey / orderSlice.js
Last active October 22, 2021 06:28
Just a gist to explain Redux Toolkit
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
export interface OrderState {
item: string;
qty: number;
total: number;
}
const initialState: OrderState = {
item: "",
const puppeteer = require('puppeteer');
async function getPic() {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('http://courseweb.sliit.lk');
await page.screenshot({path: 'courseweb.png'});
await browser.close();
}