mhaecal

import React from 'react'
import { useForm } from 'react-hook-form'
import { ErrorMessage } from '@hookform/error-message'

function App() {
  // prettier-ignore
  const { register, handleSubmit, formState: { errors } } = useForm()

  const onSubmit = ({ username, password }) => {
    alert(`Username: ${username}, Password: ${password}`)

mhaecal

import React from 'react'
import Character from './components/Character'
import { QueryClientProvider, QueryClient } from 'react-query'

const queryClient = new QueryClient()

function App() {
  return (
    <div className="App">
      <QueryClientProvider client={queryClient}>

mhaecal

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,

mhaecal

import React, { useState } from 'react'
import {
	useGetPokemonByIdQuery,
	useGetPokemonByNameQuery,
} from './services/pokemon'

function App() {
	const [id, setId] = useState<number>(5)
	const [name, setName] = useState<string>('bulbasaur')

mhaecal

import React from 'react'
import { Outlet } from 'react-router-dom'

export default function App() {
  return <Outlet />
}

mhaecal

items.sort(function(a, b) { 
  return a.id - b.id  ||  a.name.localeCompare(b.name);
});

mhaecal

https://play.tailwindcss.com/nnNpg60Lpu

mhaecal

const { useState } = React;

function PageComponent() {
  const [count, setCount] = useState(0);
  const increment = () => {
    setCount(count + 1)
  }

  return (
    <div className="App">

mhaecal

import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

export function middleware(req: NextRequest) {
  // get cookie token
  const hasToken = req.cookies.get('token')

  // protected routes (admin routes)
  if (req.nextUrl.pathname.startsWith('/admin')) {
    if (hasToken) {

mhaecal

import '../styles/globals.css'
import type { AppProps } from 'next/app'
import type { NextPage } from 'next'
import type { ReactElement, ReactNode } from 'react'

export type NextPageWithLayout = NextPage & {
  getLayout?: (page: ReactElement) => ReactNode
}

type AppPropsWithLayout = AppProps & {