diff options
22 files changed, 181 insertions, 128 deletions
diff --git a/boilerplate/typescript/package.json b/boilerplate/typescript/package.json index fc8ec8c6ebfb..104e7272da93 100644 --- a/boilerplate/typescript/package.json +++ b/boilerplate/typescript/package.json @@ -4,11 +4,13 @@ "main": "index.js", "license": "MIT", "scripts": { - "dev": "npx parcel src/index.html & npx tsc --watch --noEmit" + "dev": "parcel src/index.html & npx tsc --watch --noEmit", + "prettier": "prettier --ignore-path .gitignore --write \"**/*.{js,ts,jsx,tsx,html,css.json}\"" }, "devDependencies": { "@types/node": "^13.9.3", "parcel-bundler": "^1.12.4", + "prettier": "^2.0.2", "tailwindcss": "^1.2.0", "typescript": "^3.8.3" }, diff --git a/boilerplate/typescript/src/index.html b/boilerplate/typescript/src/index.html index 05dd7ad95e79..91752af916a4 100644 --- a/boilerplate/typescript/src/index.html +++ b/boilerplate/typescript/src/index.html @@ -1,8 +1,8 @@ <!DOCTYPE html> <html lang="en"> <head> - <meta charset="UTF-8"> - <link rel="stylesheet" href="./index.css"> + <meta charset="UTF-8" /> + <link rel="stylesheet" href="./index.css" /> </head> <body> <div id="mount"></div> diff --git a/boilerplate/typescript/yarn.lock b/boilerplate/typescript/yarn.lock index 09961c3276f3..0e16fe80a47c 100644 --- a/boilerplate/typescript/yarn.lock +++ b/boilerplate/typescript/yarn.lock @@ -4287,6 +4287,11 @@ prelude-ls@~1.1.2: resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ= +prettier@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.0.2.tgz#1ba8f3eb92231e769b7fcd7cb73ae1b6b74ade08" + integrity sha512-5xJQIPT8BraI7ZnaDwSbu5zLrB6vvi8hVV58yHQ+QK64qrY40dULy0HSRlQ2/2IdzeBpjhDkqdcFBnFeDEMVdg== + pretty-hrtime@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1" diff --git a/scratch/deepmind/part_two/package-lock.json b/scratch/deepmind/part_two/package-lock.json index 94c89c5979c4..340aad9f5ce2 100644 --- a/scratch/deepmind/part_two/package-lock.json +++ b/scratch/deepmind/part_two/package-lock.json @@ -28,6 +28,12 @@ "integrity": "sha512-c3sIjNUow0+8swNwVpqoH4YCShKNFkMaw6oH1mNS2haDZQqkeZFlHS3dhoeEbKKmJB4vXpJucU6oH75aDYeE9g==", "dev": true }, + "prettier": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.0.2.tgz", + "integrity": "sha512-5xJQIPT8BraI7ZnaDwSbu5zLrB6vvi8hVV58yHQ+QK64qrY40dULy0HSRlQ2/2IdzeBpjhDkqdcFBnFeDEMVdg==", + "dev": true + }, "source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", diff --git a/scratch/deepmind/part_two/package.json b/scratch/deepmind/part_two/package.json index c9ef307ca0ee..1f10668ec861 100644 --- a/scratch/deepmind/part_two/package.json +++ b/scratch/deepmind/part_two/package.json @@ -9,6 +9,7 @@ "author": "William Carroll", "license": "MIT", "devDependencies": { + "prettier": "^2.0.2", "ts-node": "^8.6.2", "typescript": "^3.7.5" } diff --git a/scratch/deepmind/part_two/top-scores.ts b/scratch/deepmind/part_two/top-scores.ts index ffed9ae59bc5..79c10c883211 100644 --- a/scratch/deepmind/part_two/top-scores.ts +++ b/scratch/deepmind/part_two/top-scores.ts @@ -8,7 +8,7 @@ function sortScores(xs: Array<number>, highest: number): Array<number> { } for (let i = 0; i < xs.length; i += 1) { - counts[xs[i]] += 1 + counts[xs[i]] += 1; } for (let i = highest; i >= 0; i -= 1) { @@ -22,29 +22,28 @@ function sortScores(xs: Array<number>, highest: number): Array<number> { return result; } - // Tests -let desc = 'no scores'; +let desc = "no scores"; let actual = sortScores([], 100); let expected = []; assertEqual(JSON.stringify(actual), JSON.stringify(expected), desc); -desc = 'one score'; +desc = "one score"; actual = sortScores([55], 100); expected = [55]; assertEqual(JSON.stringify(actual), JSON.stringify(expected), desc); -desc = 'two scores'; +desc = "two scores"; actual = sortScores([30, 60], 100); expected = [60, 30]; assertEqual(JSON.stringify(actual), JSON.stringify(expected), desc); -desc = 'many scores'; +desc = "many scores"; actual = sortScores([37, 89, 41, 65, 91, 53], 100); expected = [91, 89, 65, 53, 41, 37]; assertEqual(JSON.stringify(actual), JSON.stringify(expected), desc); -desc = 'repeated scores'; +desc = "repeated scores"; actual = sortScores([20, 10, 30, 30, 10, 20], 100); expected = [30, 30, 20, 20, 10, 10]; assertEqual(JSON.stringify(actual), JSON.stringify(expected), desc); diff --git a/website/goals/package.json b/website/goals/package.json index ced454a8a315..c812e9a38ecd 100644 --- a/website/goals/package.json +++ b/website/goals/package.json @@ -4,11 +4,13 @@ "main": "index.js", "license": "MIT", "scripts": { - "dev": "npx parcel src/index.html & npx tsc --watch --noEmit" + "dev": "parcel src/index.html & npx tsc --watch --noEmit", + "prettier": "prettier --ignore-path .gitignore --write \"**/*.{js,ts,jsx,tsx,html,css.json}\"" }, "devDependencies": { "@types/node": "^13.9.3", "parcel-bundler": "^1.12.4", + "prettier": "^2.0.2", "tailwindcss": "^1.2.0", "typescript": "^3.8.3" }, diff --git a/website/goals/postcss.config.js b/website/goals/postcss.config.js index d68fa618664e..a23795075b11 100644 --- a/website/goals/postcss.config.js +++ b/website/goals/postcss.config.js @@ -1,7 +1,5 @@ -const tailwindcss = require('tailwindcss') +const tailwindcss = require("tailwindcss"); module.exports = { - plugins: [ - tailwindcss('./tailwind.config.js') - ] -} + plugins: [tailwindcss("./tailwind.config.js")], +}; diff --git a/website/goals/src/App.tsx b/website/goals/src/App.tsx index 078a75460181..53195d9af98f 100644 --- a/website/goals/src/App.tsx +++ b/website/goals/src/App.tsx @@ -1,74 +1,84 @@ -import React from "react"; +import React from "react"; function ProgressBar(props: { - done: number, - total: number, - units: string, - color: string, + done: number; + total: number; + units: string; + color: string; }) { - const { done, total, units, color } = props - const width = Math.floor(done / total * 100) - const rest = 100 - width + const { done, total, units, color } = props; + const width = Math.floor((done / total) * 100); + const rest = 100 - width; - let [fg, bg] = [`bg-${color}-600`, `bg-${color}-100`] + let [fg, bg] = [`bg-${color}-600`, `bg-${color}-100`]; - if (color === 'white') { - [fg, bg] = ['bg-gray-600', 'bg-gray-100'] + if (color === "white") { + [fg, bg] = ["bg-gray-600", "bg-gray-100"]; } return ( <div className={`relative ${bg} h-5`}> - <div className={`${fg} h-5 absolute top-0 left-0`} style={{width: `${width}%`}}></div> - <p className="absolute text-xs pl-1 pt-1">{done} of {total} {units}</p> + <div + className={`${fg} h-5 absolute top-0 left-0`} + style={{ width: `${width}%` }} + ></div> + <p className="absolute text-xs pl-1 pt-1"> + {done} of {total} {units} + </p> </div> - ) + ); } function Goal(props: { - subject: string, - goal: string, - done: number, - total: number, - units: string, - color: string, + subject: string; + goal: string; + done: number; + total: number; + units: string; + color: string; }) { - const { subject, goal, done, total, units, color } = props - const width = "6em" + const { subject, goal, done, total, units, color } = props; + const width = "6em"; const Tr = (props: { - label: string, - value: string, - valueComponent?: React.ReactElement, + label: string; + value: string; + valueComponent?: React.ReactElement; }) => ( <tr className="flex py-2"> - <td className="text-gray-600" style={{width: width}}>{props.label}</td> + <td className="text-gray-600" style={{ width: width }}> + {props.label} + </td> <td className="flex-1"> {props.valueComponent ? props.valueComponent : props.value} </td> </tr> - ) + ); return ( <table className="w-full mb-10"> <tbody> <Tr label="Subject" value={subject} /> <Tr label="Goal" value={goal} /> - <Tr label="Progress" value={goal} valueComponent={ - <ProgressBar done={done} total={total} units={units} color={color} /> - }/> + <Tr + label="Progress" + value={goal} + valueComponent={ + <ProgressBar + done={done} + total={total} + units={units} + color={color} + /> + } + /> </tbody> </table> - ) + ); } -function Copy(props: { - children: React.ReactNode -}) { - return ( - <p className="pb-4 leading-loose"> - {props.children} - </p> - ) +function Copy(props: { children: React.ReactNode }) { + return <p className="pb-4 leading-loose">{props.children}</p>; } function App() { @@ -78,7 +88,7 @@ function App() { <h1 className="text-center pt-12 pb-6">Goals</h1> <Copy> For me, a goal is something that is difficult for me to complete but - easy for me to measure. I tend to add new goals as time progresses, + easy for me to measure. I tend to add new goals as time progresses, mistakenly assuming that I can support additional goals for free. To counterbalance my tendancy to casually accumulate goals, I aim to only have three goals; I will not add a new goal until I complete an @@ -90,27 +100,33 @@ function App() { </Copy> </section> <section className="pt-4"> - <Goal subject="Meditation" - goal="Meditate for 10,000 hours" - done={100} - total={10000} - units="hrs" - color="purple" /> - <Goal subject="Debt" - goal="Pay my student debt balance" - done={30000} - total={70000} - units="USD" - color="green" /> - <Goal subject="Brazilian Jiu Jitsu" - goal="Train until an instructor gives me a black belt" - done={1} - total={5} - units="belts" - color="white" /> + <Goal + subject="Meditation" + goal="Meditate for 10,000 hours" + done={100} + total={10000} + units="hrs" + color="purple" + /> + <Goal + subject="Debt" + goal="Pay my student debt balance" + done={30000} + total={70000} + units="USD" + color="green" + /> + <Goal + subject="Brazilian Jiu Jitsu" + goal="Train until an instructor gives me a black belt" + done={1} + total={5} + units="belts" + color="white" + /> </section> </div> - ) + ); } export default App; diff --git a/website/goals/src/index.html b/website/goals/src/index.html index 05dd7ad95e79..91752af916a4 100644 --- a/website/goals/src/index.html +++ b/website/goals/src/index.html @@ -1,8 +1,8 @@ <!DOCTYPE html> <html lang="en"> <head> - <meta charset="UTF-8"> - <link rel="stylesheet" href="./index.css"> + <meta charset="UTF-8" /> + <link rel="stylesheet" href="./index.css" /> </head> <body> <div id="mount"></div> diff --git a/website/goals/tailwind.config.js b/website/goals/tailwind.config.js index af829e20f9cb..3da6fa0dc7b7 100644 --- a/website/goals/tailwind.config.js +++ b/website/goals/tailwind.config.js @@ -4,4 +4,4 @@ module.exports = { }, variants: {}, plugins: [], -} +}; diff --git a/website/goals/tsconfig.json b/website/goals/tsconfig.json index 013f34fdf0b1..fe07ec1da4d4 100644 --- a/website/goals/tsconfig.json +++ b/website/goals/tsconfig.json @@ -1,11 +1,7 @@ { "compilerOptions": { "target": "es5", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], + "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, @@ -19,7 +15,5 @@ "noEmit": true, "jsx": "react" }, - "include": [ - "src/**/*" - ] + "include": ["src/**/*"] } diff --git a/website/goals/yarn.lock b/website/goals/yarn.lock index 558b9c5cd9ca..358922838b16 100644 --- a/website/goals/yarn.lock +++ b/website/goals/yarn.lock @@ -4287,6 +4287,11 @@ prelude-ls@~1.1.2: resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ= +prettier@^2.0.2: + version "2.0.2" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.0.2.tgz#1ba8f3eb92231e769b7fcd7cb73ae1b6b74ade08" + integrity sha512-5xJQIPT8BraI7ZnaDwSbu5zLrB6vvi8hVV58yHQ+QK64qrY40dULy0HSRlQ2/2IdzeBpjhDkqdcFBnFeDEMVdg== + pretty-hrtime@^1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1" diff --git a/website/learn/static/index.html b/website/learn/static/index.html index e28869ca1854..1c421a43d715 100644 --- a/website/learn/static/index.html +++ b/website/learn/static/index.html @@ -4,7 +4,10 @@ <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="description" content="Learn to code" /> - <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet"> + <link + href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" + rel="stylesheet" + /> <title>Learn to code</title> </head> <body class="font-serif container max-w-2xl mx-auto px-8"> @@ -42,33 +45,58 @@ <h2 class="text-3xl">Pricing</h2> <p class="leading-relaxed mb-4"> I charge <bold class="font-bold">£50</bold> per hour for video lessons - and <bold class="font-bold">£100</bold> per hour for in-person - sessions. I am currently based in South Kensington, London. + and <bold class="font-bold">£100</bold> per hour for in-person sessions. + I am currently based in South Kensington, London. </p> </div> <div class="my-4"> <h2 class="text-3xl">Contact</h2> <p class="leading-relaxed mb-4"> Whether you want to sign-up or simply want to learn more, send me an - email at <a href="mailto:wpcarro@gmail.com" class="font-bold text-blue-600 hover:underline">wpcarro@gmail.com</a>. + email at + <a + href="mailto:wpcarro@gmail.com" + class="font-bold text-blue-600 hover:underline" + >wpcarro@gmail.com</a + >. </p> <p class="text-center my-8">Why delay? <em>Start today.</em></p> </div> <footer class="mb-8 lg:flex"> - <a class="block py-2 lg:w-1/4 text-center hover:underline" href="https://blog.wpcarro.dev">Blog</a> - <a class="block py-2 lg:w-1/4 text-center hover:underline" href="https://linkedin.com/in/williampatrickcarroll">LinkedIn</a> - <a class="block py-2 lg:w-1/4 text-center hover:underline" href="https://twitter.com/wpcarro">Twitter</a> - <a class="block py-2 lg:w-1/4 text-center hover:underline" href="https://github.com/wpcarro">Github</a> + <a + class="block py-2 lg:w-1/4 text-center hover:underline" + href="https://blog.wpcarro.dev" + >Blog</a + > + <a + class="block py-2 lg:w-1/4 text-center hover:underline" + href="https://linkedin.com/in/williampatrickcarroll" + >LinkedIn</a + > + <a + class="block py-2 lg:w-1/4 text-center hover:underline" + href="https://twitter.com/wpcarro" + >Twitter</a + > + <a + class="block py-2 lg:w-1/4 text-center hover:underline" + href="https://github.com/wpcarro" + >Github</a + > </footer> <!-- Global site tag (gtag.js) - Google Analytics --> - <script async src="https://www.googletagmanager.com/gtag/js?id=UA-160226702-1"> - </script> + <script + async + src="https://www.googletagmanager.com/gtag/js?id=UA-160226702-1" + ></script> <script> - window.dataLayer = window.dataLayer || []; - function gtag(){dataLayer.push(arguments);} - gtag('js', new Date()); + window.dataLayer = window.dataLayer || []; + function gtag() { + dataLayer.push(arguments); + } + gtag("js", new Date()); - gtag('config', 'UA-160226702-1'); + gtag("config", "UA-160226702-1"); </script> </body> </html> diff --git a/website/sandbox/contentful/postcss.config.js b/website/sandbox/contentful/postcss.config.js index d68fa618664e..a23795075b11 100644 --- a/website/sandbox/contentful/postcss.config.js +++ b/website/sandbox/contentful/postcss.config.js @@ -1,7 +1,5 @@ -const tailwindcss = require('tailwindcss') +const tailwindcss = require("tailwindcss"); module.exports = { - plugins: [ - tailwindcss('./tailwind.config.js') - ] -} + plugins: [tailwindcss("./tailwind.config.js")], +}; diff --git a/website/sandbox/contentful/src/App.tsx b/website/sandbox/contentful/src/App.tsx index 6342bfc98dd6..288f03321804 100644 --- a/website/sandbox/contentful/src/App.tsx +++ b/website/sandbox/contentful/src/App.tsx @@ -8,7 +8,7 @@ import type { Book } from "./store"; const App: React.FC = () => { const dispatch = useDispatch(); - const { isLoading, books } = useTypedSelector(state => ({ + const { isLoading, books } = useTypedSelector((state) => ({ isLoading: state.isLoading, books: state.books, })); @@ -16,7 +16,7 @@ const App: React.FC = () => { useEffect(() => { async function fetchData() { const entries = await getClient().getEntries(); - const books = entries.items.map(x => x.fields) as Book[]; + const books = entries.items.map((x) => x.fields) as Book[]; dispatch(actions.setBooks(books)); } @@ -30,9 +30,12 @@ const App: React.FC = () => { <div className="container mx-auto"> <h1 className="py-6 text-2xl">Books</h1> <ul> - {books.map(book => ( + {books.map((book) => ( <li key={book.title} className="py-3"> - <p><span className="font-bold pr-3">{book.title}</span><span className="text-gray-600">{book.author}</span></p> + <p> + <span className="font-bold pr-3">{book.title}</span> + <span className="text-gray-600">{book.author}</span> + </p> </li> ))} </ul> diff --git a/website/sandbox/contentful/src/contentful.ts b/website/sandbox/contentful/src/contentful.ts index e09cd8fc4ad3..02ebc92b68df 100644 --- a/website/sandbox/contentful/src/contentful.ts +++ b/website/sandbox/contentful/src/contentful.ts @@ -8,10 +8,10 @@ let client: ContentfulClientApi; // Idempotent way to get a reference to the Contentful client. export const getClient = (): ContentfulClientApi => { - if (typeof client !== 'undefined') { + if (typeof client !== "undefined") { return client; } else { - if (typeof space === 'string' && typeof accessToken === 'string') { + if (typeof space === "string" && typeof accessToken === "string") { let client = createClient({ space, accessToken, @@ -19,7 +19,9 @@ export const getClient = (): ContentfulClientApi => { return client; } else { - throw new Error('Please set CONTENTFUL_SPACE_ID and CONTENTFUL_ACCESS_TOKEN'); + throw new Error( + "Please set CONTENTFUL_SPACE_ID and CONTENTFUL_ACCESS_TOKEN" + ); } } -} +}; diff --git a/website/sandbox/contentful/src/index.html b/website/sandbox/contentful/src/index.html index 05dd7ad95e79..91752af916a4 100644 --- a/website/sandbox/contentful/src/index.html +++ b/website/sandbox/contentful/src/index.html @@ -1,8 +1,8 @@ <!DOCTYPE html> <html lang="en"> <head> - <meta charset="UTF-8"> - <link rel="stylesheet" href="./index.css"> + <meta charset="UTF-8" /> + <link rel="stylesheet" href="./index.css" /> </head> <body> <div id="mount"></div> diff --git a/website/sandbox/contentful/src/store.ts b/website/sandbox/contentful/src/store.ts index c4396d681a17..b02053d302b6 100644 --- a/website/sandbox/contentful/src/store.ts +++ b/website/sandbox/contentful/src/store.ts @@ -22,9 +22,9 @@ export const { actions, reducer } = createSlice({ name: "application", initialState, reducers: { - toggleIsLoading: state => ({ ...state, isLoading: !state.isLoading }), - setBooks: (state, action) => ({ ... state, books: action.payload }), - } + toggleIsLoading: (state) => ({ ...state, isLoading: !state.isLoading }), + setBooks: (state, action) => ({ ...state, books: action.payload }), + }, }); /** diff --git a/website/sandbox/contentful/tailwind.config.js b/website/sandbox/contentful/tailwind.config.js index af829e20f9cb..3da6fa0dc7b7 100644 --- a/website/sandbox/contentful/tailwind.config.js +++ b/website/sandbox/contentful/tailwind.config.js @@ -4,4 +4,4 @@ module.exports = { }, variants: {}, plugins: [], -} +}; diff --git a/website/sandbox/contentful/tsconfig.json b/website/sandbox/contentful/tsconfig.json index 013f34fdf0b1..fe07ec1da4d4 100644 --- a/website/sandbox/contentful/tsconfig.json +++ b/website/sandbox/contentful/tsconfig.json @@ -1,11 +1,7 @@ { "compilerOptions": { "target": "es5", - "lib": [ - "dom", - "dom.iterable", - "esnext" - ], + "lib": ["dom", "dom.iterable", "esnext"], "allowJs": true, "skipLibCheck": true, "esModuleInterop": true, @@ -19,7 +15,5 @@ "noEmit": true, "jsx": "react" }, - "include": [ - "src/**/*" - ] + "include": ["src/**/*"] } diff --git a/website/sandbox/index.html b/website/sandbox/index.html index b549bf443e07..ecd5475af266 100644 --- a/website/sandbox/index.html +++ b/website/sandbox/index.html @@ -1,7 +1,7 @@ <!DOCTYPE html> <html lang="en"> <head> - <meta charset="UTF-8"> + <meta charset="UTF-8" /> <title>sandbox.wpcarro.dev</title> </head> <body> |