Skip to content

Instantly share code, notes, and snippets.

View adrianhajdin's full-sized avatar

Adrian Hajdin - JS Mastery adrianhajdin

23.5k followers · 0 following
View GitHub Profile
@adrianhajdin
adrianhajdin / SearchFilters.jsx
Created November 25, 2021 18:56
import { useEffect, useState } from 'react';
import { Flex, Select, Box, Text, Input, Spinner, Icon, Button } from '@chakra-ui/react';
import { useRouter } from 'next/router';
import { MdCancel } from 'react-icons/md';
import Image from 'next/image';
import { filterData, getFilterValues } from '../utils/filterData';
import { baseUrl, fetchApi } from '../utils/fetchApi';
import noresult from '../assets/images/noresult.svg';
@adrianhajdin
adrianhajdin / globals.css
Created July 2, 2022 13:30
Build and Deploy a Full Stack TikTok Clone Application and Master TypeScript | Full Course (Part 1)
@tailwind base;
@tailwind components;
@tailwind utilities;
html,
body {
padding: 0;
margin: 0;
box-sizing: border-box;
}
@adrianhajdin
adrianhajdin / materials.js
Created August 4, 2020 09:52
Alan AI News Project Materials
// 1. NewsCard/styles.js:
import { makeStyles } from '@material-ui/core/styles';
export default makeStyles({
media: {
height: 250,
},
border: {
border: 'solid',
},
@adrianhajdin
adrianhajdin / Poll.jsx
Created September 29, 2021 17:28
Agora
import React, { useState, useEffect, useContext } from "react";
import Modal from 'react-modal';
import { Line } from 'rc-progress';
import { Text } from 'react-native';
import chatContext, {controlMessageEnum} from './ChatContext';
import { PollContext } from './PollContext';
import styles from './pollStyles';
@adrianhajdin
adrianhajdin / buildQuery.ts
Created September 18, 2023 13:34
How I Made My Website Load in 0.364 Seconds | Build and Deploy
export function buildQuery(params: BuildQueryParams) {
const { type, query, category, page = 1, perPage = 20 } = params;
const conditions = [`*[_type=="${type}"`];
if (query) conditions.push(`title match "*${query}*"`);
if (category && category !== "all") {
conditions.push(`category == "${category}"`);
}
@adrianhajdin
adrianhajdin / FeaturedPostCard.jsx
Created November 4, 2021 08:13
GraphCMS Blog
import React from 'react';
import moment from 'moment';
import Image from 'next/image';
import Link from 'next/link';
const FeaturedPostCard = ({ post }) => (
<div className="relative h-72">
<div className="absolute rounded-lg bg-center bg-no-repeat bg-cover shadow-md inline-block w-full h-72" style={{ backgroundImage: `url('${post.featuredImage.url}')` }} />
<div className="absolute rounded-lg bg-center bg-gradient-to-b opacity-50 from-gray-400 via-gray-700 to-black w-full h-72" />
<div className="flex flex-col rounded-lg p-4 items-center justify-center absolute w-full h-full">
@adrianhajdin
adrianhajdin / index.js
Created January 26, 2019 21:09
HTML Template
module.exports = ({ name, price1, price2, receiptId }) => {
const today = new Date();
return `
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PDF Result Template</title>
<style>
.invoice-box {
@adrianhajdin
adrianhajdin / App.css
Created September 18, 2021 12:59
Develop a React Cryptocurrency App and Master Redux Toolkit in One Video
:root{
--text-primary:#000;
--bgPrimary:#fff;
--bgSecondary: #F9F9F9;
--pink: #0071bd;
--light-blue: #e6f7ff;
--border: #d9d9d9;
}
@adrianhajdin
adrianhajdin / AppStyles.js
Last active March 3, 2024 17:33
Video Chat Styles
const useStyles = makeStyles((theme) => ({
appBar: {
borderRadius: 15,
margin: '30px 100px',
display: 'flex',
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
width: '600px',
border: '2px solid black',
@adrianhajdin
adrianhajdin / style.css
Created December 23, 2022 09:14
Build and Deploy Your Own ChatGPT AI Application That Will Help You Code
@import url("https://fonts.googleapis.com/css2?family=Alegreya+Sans:wght@100;300;400;500;700;800;900&display=swap");
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Alegreya Sans", sans-serif;
}
body {