From 514136c99af6f1807f07d23640405764f1c674df Mon Sep 17 00:00:00 2001 From: William Carroll Date: Fri, 27 Mar 2020 10:52:13 +0000 Subject: Run Prettier across projects Problem: Prettier was not running when I saved Emacs buffers. Why? - prettier-js-mode needs needs node; lorri exposes node to direnv; direnv exposes node to Emacs; lorri was not working as expected. Solution: Now that I'm using nix-buffer, I can properly expose node (and other dependencies) to my Emacs buffers. Now Prettier is working. Commentary: Since prettier hadn't worked for so long, I stopped thinking about it. As such, I did not include it as a dependency in boilerplate/typescript. I added it now. I retroactively ran prettier across a few of my frontend projects to unify the code styling. I may need to run... ```shell $ cd ~/briefcase $ nix-shell $ npx prettier --list-different "**/*.{js,ts,jsx,tsx,html,css,json}" ``` ...to see which files I should have formatted. --- boilerplate/typescript/package.json | 4 +- boilerplate/typescript/src/index.html | 4 +- boilerplate/typescript/yarn.lock | 5 + scratch/deepmind/part_two/package-lock.json | 6 ++ scratch/deepmind/part_two/package.json | 1 + scratch/deepmind/part_two/top-scores.ts | 13 ++- website/goals/package.json | 4 +- website/goals/postcss.config.js | 8 +- website/goals/src/App.tsx | 134 ++++++++++++++------------ website/goals/src/index.html | 4 +- website/goals/tailwind.config.js | 2 +- website/goals/tsconfig.json | 10 +- website/goals/yarn.lock | 5 + website/learn/static/index.html | 56 ++++++++--- website/sandbox/contentful/postcss.config.js | 8 +- website/sandbox/contentful/src/App.tsx | 11 ++- website/sandbox/contentful/src/contentful.ts | 10 +- website/sandbox/contentful/src/index.html | 4 +- website/sandbox/contentful/src/store.ts | 6 +- website/sandbox/contentful/tailwind.config.js | 2 +- website/sandbox/contentful/tsconfig.json | 10 +- website/sandbox/index.html | 2 +- 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 @@ - - + +
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, highest: number): Array { } 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, highest: number): Array { 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 (
-
-

{done} of {total} {units}

+
+

+ {done} of {total} {units} +

- ) + ); } 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; }) => ( - {props.label} + + {props.label} + {props.valueComponent ? props.valueComponent : props.value} - ) + ); return ( - - }/> + + } + />
- ) + ); } -function Copy(props: { - children: React.ReactNode -}) { - return ( -

- {props.children} -

- ) +function Copy(props: { children: React.ReactNode }) { + return

{props.children}

; } function App() { @@ -78,7 +88,7 @@ function App() {

Goals

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() {
- - - + + +
- ) + ); } 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 @@ - - + +
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 @@ - + Learn to code @@ -42,33 +45,58 @@

Pricing

I charge £50 per hour for video lessons - and £100 per hour for in-person - sessions. I am currently based in South Kensington, London. + and £100 per hour for in-person sessions. + I am currently based in South Kensington, London.

Contact

Whether you want to sign-up or simply want to learn more, send me an - email at wpcarro@gmail.com. + email at + wpcarro@gmail.com.

Why delay? Start today.

- + 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 = () => {

Books

    - {books.map(book => ( + {books.map((book) => (
  • -

    {book.title}{book.author}

    +

    + {book.title} + {book.author} +

    • ))}
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 @@ - - + +
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 @@ - + sandbox.wpcarro.dev -- cgit 1.4.1