This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Fluent UI uses CSS-in-JS - We should opt for that as well. | |
Formik vs react-hook-form | |
Formik is older, components take longer to mount, re-renders the entire form on field change. | |
react-hook-form was written to replace Formik, better mount and rendering performance | |
Both Formik and react-hook-form have good community adoption (above 1mil npm weekly downloads) | |
Formik - https://www.npmjs.com/package/formik | |
Size - 13kB |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<title>Touch logger</title> | |
<style> | |
html, | |
body { | |
width: 100%; | |
height: 100%; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<input | |
type="file" | |
accept=".obf, .obz" | |
onChange={event => { | |
readFiles(event.target.files); | |
}} | |
/> | |
export async function readFiles(files: FileList): Promise<BoardSet[]> { | |
const obz = await parseOBZ(await readOBZFile(file)) |