kentcdodds

// Menu: Optical Character Recognition
// Description: Extract text from images
// Author: Kent C. Dodds
// Twitter: @kentcdodds

import '@johnlindquist/kit'
import Tesseract from 'tesseract.js'

const clipboardImage = await clipboard.readImage()

kentcdodds

// Menu: Optical Character Recognition
// Description: Extract text from images
// Author: Kent C. Dodds
// Twitter: @kentcdodds

import '@johnlindquist/kit'
import Tesseract from 'tesseract.js'

const clipboardImage = await clipboard.readImage()

kentcdodds

// Menu: Optical Character Recognition
// Description: Extract text from images
// Author: Kent C. Dodds
// Twitter: @kentcdodds

import '@johnlindquist/kit'
import Tesseract from 'tesseract.js'

const clipboardImage = await clipboard.readImage()

kentcdodds

import type { DataFunctionArgs } from '@remix-run/node'

export async function loader({ request }: DataFunctionArgs) {
	const width = 1280
	const height = 720
	const starfieldSvg = /* html */ `
<svg id="starfield" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${width} ${height}" style="background-color:#090909;">
<style>
@keyframes sparkle {
  0% { opacity: 0.3; }

kentcdodds

import { z } from 'zod'

export function preprocessFormData<Schema extends z.ZodTypeAny>(
	formData: FormData,
	schema: Schema,
) {
	const shape = getShape(schema)
	return mapObj(shape, ([name, propertySchema]) =>
		transformFormDataValue(
			getFormValue(formData, String(name), propertySchema),

kentcdodds

[2021-11-18 18:49:03.381] [info]  Protocols Prepared
[2021-11-18 18:49:03.386] [info]  Tray created
[2021-11-18 18:49:03.389] [info]  Shortcuts Assigned
[2021-11-18 18:49:03.398] [info]  Prompt window created
[2021-11-18 18:49:03.399] [info]  Tick started
[2021-11-18 18:49:03.399] [info]  Kit.app is ready...
[2021-11-18 18:49:03.406] [info]  SHORTCUTS DB CHANGED: /Users/kentcdodds/.kit/db/shortcuts.json
[2021-11-18 18:49:03.411] [info]  Registered CommandOrControl+; to /Users/kentcdodds/.kit/main/index.js
[2021-11-18 18:49:03.412] [info]  Registered CommandOrControl+Alt+Control+C to /Users/kentcdodds/.kenv/scripts/cloudinary-upload.js
[2021-11-18 18:49:03.413] [info]  Registered CommandOrControl+Alt+Control+O to /Users/kentcdodds/.kenv/scripts/daily-story.js

kentcdodds

Headers and Caching

Caching is a big subject and it can get pretty complicated. Luckily, the browsers have done all the really hard work for us and we just need to #useThePlatform.

There are three types of caches you'll likely deal with in Remix applications:

1. Application-level caches that you implement in your own code.
2. Browser caches you can control through the Cache-Control header.
3. CDN caches you also can control through the Cache-Control headers.

kentcdodds

import * as bcrypt from "bcrypt";
import { createCookieSessionStorage, redirect } from "remix";

import { db } from "./db.server";

export type LoginForm = {
  username: string;
  password: string;
};

kentcdodds

import * as React from 'react'
import {useLocation} from 'react-router-dom'
import {useTransition} from '@remix-run/react'
import {useBeforeUnload} from 'remix'
import {useSSRLayoutEffect} from './misc'

let firstRender = true
let positions: {[key: string]: number} = {}
const SESSION_STORAGE_KEY = 'kody_scroll_positions'

kentcdodds

function Cell({
  value,
  row: {values: user},
  column: {id: propertyName},
}: {
  value: string
  row: {values: User}
  column: {id: string}
}) {