diff --git a/README.md b/README.md index 2b5f90bde..1b7476dd9 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ > A Wild Introduction to Computer Science -![Y Combinator for Non-programmers](public/static/images/og-image-en.png) +[![Y Combinator for Non-programmers](public/static/images/og-image-en@2x.png)](https://ycombinator.chibicode.com/) This is the repository for the website: **[Y Combinator for Non-programmers](https://ycombinator.chibicode.com/)** by Shu Uesugi. @@ -18,9 +18,8 @@ yarn dev:en ## Stack -- [TypeScript](https://www.typescriptlang.org/), [React](https://reactjs.org/), and [Next.js](https://nextjs.org/). +- [TypeScript](https://www.typescriptlang.org/), [React](https://reactjs.org/), [Emotion](https://emotion.sh/) and [Next.js](https://nextjs.org/). - [Netlify](https://netlify.com/) for deployment -- No Google Analytics! ## License & Credits diff --git a/public/static/images/og-image-en@2x.png b/public/static/images/og-image-en@2x.png new file mode 100644 index 000000000..52df1a4c0 Binary files /dev/null and b/public/static/images/og-image-en@2x.png differ diff --git a/scripts/lib/runnerConfigs.ts b/scripts/lib/runnerConfigs.ts index 0ae62691e..eecc73915 100644 --- a/scripts/lib/runnerConfigs.ts +++ b/scripts/lib/runnerConfigs.ts @@ -17,6 +17,13 @@ export const qxob: ExpressionRunnerShorthandConfig = { showPriorities: true } +export const bcgp: ExpressionRunnerShorthandConfig = { + runner: 'simple', + initialExpressionContainer: initialExpressionContainers.pisd, + initialState: 'showFuncUnbound', + showPriorities: true +} + export const pbhg: ExpressionRunnerShorthandConfig = { runner: 'simple', initialExpressionContainer: initialExpressionContainers.pisd, diff --git a/src/components/ContentTags/Inline.tsx b/src/components/ContentTags/Inline.tsx index 754e987d6..ffb720dcd 100644 --- a/src/components/ContentTags/Inline.tsx +++ b/src/components/ContentTags/Inline.tsx @@ -27,7 +27,7 @@ const HighlightContext = React.createContext( const mix = (color: CardProps['color'], base: string) => Color(base) - .mix(Color(backgroundColor(color)), 0.4) + .mix(Color(backgroundColor(color)), color === 'grey' ? 0.25 : 0.4) .hsl() .string() diff --git a/src/components/EpisodeCardList.tsx b/src/components/EpisodeCardList.tsx index 921f8ab51..c9e3b84da 100644 --- a/src/components/EpisodeCardList.tsx +++ b/src/components/EpisodeCardList.tsx @@ -155,6 +155,14 @@ const EpisodeCardList = ({ content: ( <> + {episodeNumber <= numEpisodesExceptFirstAndLast && ( + <> +

+ To go to the next page, press this button: +

+ + + )} ) } diff --git a/src/components/EpisodePageFooter.tsx b/src/components/EpisodePageFooter.tsx index 0d2f49332..6ae58ca50 100644 --- a/src/components/EpisodePageFooter.tsx +++ b/src/components/EpisodePageFooter.tsx @@ -5,7 +5,7 @@ import H from 'src/components/H' import Emoji from 'src/components/Emoji' import { spaces, colors, fontSizes } from 'src/lib/theme' import locale from 'src/lib/locale' -import { githubRepo } from 'src/lib/meta' +import { githubRepo, jpBaseUrl } from 'src/lib/meta' const linkClasses = css` text-decoration: none; @@ -30,7 +30,7 @@ const EpisodePageFooter = () => { font-size: ${fontSizes(0.7)}; `} > - {locale === 'jp' && ( + {locale === 'jp' ? ( <> { {' '} ·{' '} + ) : ( + <> + + Japanese Site (日本語版) + {' '} + ·{' '} + )} { html { font-size: 18px; color: ${colors('grey900')}; - line-height: ${lineHeights(1.5)}; + line-height: ${lineHeights(1.55)}; } body { diff --git a/src/components/H.tsx b/src/components/H.tsx index dced78be0..7bff5c91f 100644 --- a/src/components/H.tsx +++ b/src/components/H.tsx @@ -38,7 +38,7 @@ import EmojiNumber from 'src/components/EmojiNumber' import TwitterEmbed from 'src/components/TwitterEmbed' import { shareId, shareVisible } from 'src/lib/twitter' import { dateString, dateSchemaString } from 'src/lib/date' -import { githubRepo, jpBaseUrl } from 'src/lib/meta' +import { githubRepo, jpBaseUrl, enBaseUrl } from 'src/lib/meta' import CustomEmoji from 'src/components/CustomEmoji' import InlinePrioritiesLabel from 'src/components/InlinePrioritiesLabel' import { VariableNames } from 'src/types/VariableNames' @@ -1206,9 +1206,9 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => {
ソースコード:{' '} GitHubで公開中 - {/*
+
英語版:{' '} - 英語版はこちら*/} + 英語版はこちら {args.includeTwitter && ( <>
@@ -1829,14 +1829,13 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { Twitter: @chibicode - . I’d also appreciate it if you could read until the end of this - course before emailing me - let me know what you think! + .

    I’m mainly looking for{' '} a senior engineering position. But I’m - also interested in product-leaning positions (Product design, + also interested in product-leaning positions (product design, PM, DevRel, etc.) for developer-facing products. I’m better at front-end than back-end, but can do both. @@ -1844,15 +1843,33 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { Location preference:{' '} Remote would be ideal. 2nd preference is Los Angeles. I’m currently - in SF Bay Area, but my wife and I are looking to relocate to LA - or other more affordable places. + in SF Bay Area (3rd preference), but my wife and I are looking + to relocate to LA or other more affordable places. + + + Other preferences: My last full-time job was in + edtech/media, but{' '} + I’m looking at a wide range of areas. I + like companies that think machine learning is the new SQL (see{' '} + + this article + {' '} + and{' '} + + this article + {' '} + by Benedict Evans). I don’t like whiteboard interviews, but{' '} + + if you ask me to implement Y Combinator on a whiteboard + + , I think I’ll do well. 😉

More about me:

    - Work experience (2010-2017):{' '} + Work experience (pre-2017):{' '} I worked as a lead full-stack (Rails) developer at{' '} @@ -1863,7 +1880,9 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { . I was the first engineering hire and was involved in architecting pretty much all of the projects. Before that, I was a product designer at Quora (2011-2012) and an engineer at - Palantir (2010-2011). + Palantir (2010-2011). I studied Computer Science (undergrad) and + Human-Computer Interaction (grad) at Carnegie Mellon and won the + best teaching assistant award upon graduation. In 2017: After 4.5 years at EdSurge, I spent almost @@ -1879,9 +1898,9 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { I co-translated a book called{' '} - “Factfulness” + “Factfulness” {' '} - by Hans Rosling and others into Japanese. + (by Hans Rosling and others) into Japanese. {' '} It went on sale in 2019 and became one of Japan’s top-selling nonfiction books of the year. It’s a great book -{' '} @@ -1897,9 +1916,7 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { src="/static/images/shu-uesugi-factfulness-square.jpg" caption={ <> - The Japanese edition of “Factfulness”: -
    - Photo taken at Bạch Mai Hospital in Hanoi, Vietnam, + Me at Bạch Mai Hospital in Hanoi, Vietnam,
    where Hans Rosling (the author) had worked. @@ -1909,19 +1926,21 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => {
      In 2019: I spent time marketing the Japanese - edition of “Factfulness”, freelancing (Rails dev), and working - on this course. I got married and spent a lot of time with my - wife, who moved to the U.S. from Japan. And I’m now looking for - a full-time job. + edition of “Factfulness”, freelancing (Rails dev for small + startups), and working on this course. I got married and spent a + lot of time with my wife, who moved to the U.S. from Japan. And + I’m now looking for a full-time job. - Things I enjoy:{' '} - Expository writing (like this course) and{' '} + Things I’m pretty good at:{' '} + Expository writing (like this course),{' '} React/TypeScript ( see the repo for this course - ) + ), and product design (but not visual + design). I’ve also worked with Rails from + version 1 to version 6. Current interests: As a professional EN → JP @@ -1930,12 +1949,12 @@ const H = ({ args, highlightType, episodeNumberOverrides }: HProps) => { using AI to augment human intelligence - . + . I try to read about deep learning in my spare time.

    - Again: Contact me at{' '} + If you’re interested: Contact me at{' '} shu@chibicode.com {' '} diff --git a/src/components/Runners/Bcgp.tsx b/src/components/Runners/Bcgp.tsx new file mode 100644 index 000000000..aa2864831 --- /dev/null +++ b/src/components/Runners/Bcgp.tsx @@ -0,0 +1,12 @@ +import React from 'react' +import ExpressionRunnerPrecomputed from 'src/components/ExpressionRunnerPrecomputed' +import config from 'src/lib/runners/bcgp.json' + +const Bcgp = ({ children }: { children?: React.ReactNode }) => ( + // @ts-ignore + + {children} + +) + +export default Bcgp diff --git a/src/components/Runners/fakeIndex.ts b/src/components/Runners/fakeIndex.ts index 7fb394e84..0c9e2f429 100644 --- a/src/components/Runners/fakeIndex.ts +++ b/src/components/Runners/fakeIndex.ts @@ -1,5 +1,6 @@ export { default as Aaov } from 'src/components/FakeRunner' export { default as Qxob } from 'src/components/FakeRunner' +export { default as Bcgp } from 'src/components/FakeRunner' export { default as Pbhg } from 'src/components/FakeRunner' export { default as Wwtl } from 'src/components/FakeRunner' export { default as Vdhd } from 'src/components/FakeRunner' diff --git a/src/components/Runners/index.ts b/src/components/Runners/index.ts index 803313dd4..de3ee3c8c 100644 --- a/src/components/Runners/index.ts +++ b/src/components/Runners/index.ts @@ -1,5 +1,6 @@ export { default as Aaov } from 'src/components/Runners/Aaov' export { default as Qxob } from 'src/components/Runners/Qxob' +export { default as Bcgp } from 'src/components/Runners/Bcgp' export { default as Pbhg } from 'src/components/Runners/Pbhg' export { default as Wwtl } from 'src/components/Runners/Wwtl' export { default as Vdhd } from 'src/components/Runners/Vdhd' diff --git a/src/contents/0.en.tsx b/src/contents/0.en.tsx index 2ee85b162..46de13bcb 100644 --- a/src/contents/0.en.tsx +++ b/src/contents/0.en.tsx @@ -60,7 +60,7 @@ export default () => ( It’s 100% FREE, and you can do it from
    - your smartphone, tablet, or computer. + your smartphone, tablet, or computer } /> @@ -242,8 +242,8 @@ export default () => ( FAQ page - , they say they chose the name “Y Combinator” because it’s{' '} - “one of the coolest ideas in computer science.” + , they say they chose the name “Y Combinator” because it’s “ + one of the coolest ideas in computer science.”

    Furthermore:{' '} @@ -275,8 +275,8 @@ export default () => ( “That’s so cool. They’re named after the Y Combinator. There must be something going on here.” {' '} - And suits would look at it and think,{' '} - “Y Combinator, what’s that?” + And suits would look at it and think, “ + Y Combinator, what’s that?”

    That was what we wanted. We wanted hackers to notice us, @@ -425,9 +425,8 @@ export default () => ( } />

    - 🤔 So I thought: If I could teach a - difficult computer science concept like Y Combinator to - non-programmers in 2 to 3 hours, that means{' '} + 🤔 So I thought: If I could teach Y + Combinator to non-programmers, that means{' '} I’d be able to teach{' '} other difficult computer science concepts to @@ -459,8 +458,8 @@ export default () => ( I want to make it easier for non-programmers to learn difficult computer science concepts as quickly as possible - {' '} - - without having to learn to code. This course is my first step in + + —without having to learn to code. This course is my first step in this direction.

    (

    Downside: I admit that this is not the best way to introduce computer science to non-programmers. That’s why I’m - calling this course a “wild” introduction to + calling this course a “wild” introduction to computer science.

    @@ -486,15 +485,14 @@ export default () => ( teach programming first. However, learning to code takes time, and{' '} - most people - especially adults - won’t ever learn to code. + most people—especially adults—won’t ever learn to code. {' '} As{' '} software is eating the world , I believe there need to be more ways to teach computer science - without requiring programming knowledge -{' '} - even if they’re not ideal. + without requiring programming knowledge.

    ) @@ -545,9 +543,9 @@ export default () => ( emojis={['📱', '🧩', '💻']} description={ <> - Puzzles are optimized for smartphones. + The puzzles are optimized for smartphones.
    - They can be done on a computer too. + They can be done on a computer too } /> @@ -564,9 +562,9 @@ export default () => (

    I had to pack a lot of materials so it can be read in under 3 hours, so it’s fast-paced and challenging.{' '} - You might find it difficult if you don’t enjoy puzzles, but{' '} - you’ll never get stuck. I made it so that - you can keep reading even if you don’t understand everything. + However, you’ll never get stuck—I made it + so that you can finish the course even if you don’t understand + everything (and that’s okay! 🤗).

    ), @@ -639,7 +637,10 @@ export default () => ( footer: { content: ( <> +

    Also, sorry for not introducing myself earlier…

    +

    To go to the next page, press this button:

    + ) } diff --git a/src/contents/1.en.tsx b/src/contents/1.en.tsx index d93088395..4ea15e2e0 100644 --- a/src/contents/1.en.tsx +++ b/src/contents/1.en.tsx @@ -17,6 +17,7 @@ import EmojiSeparator from 'src/components/EmojiSeparator' import EmojiNumber from 'src/components/EmojiNumber' import NextLessonButton from 'src/components/NextLessonButton' import * as R from 'src/components/Runners' +import ExpressionRunnerSeparator from 'src/components/ExpressionRunnerSeparator' export default () => ( ( ]} description={ <> - Mathbox is a magical tool that can do the math. + Mathbox is a magical tool +
    + that can solve math questions } />

    - Let me explain how mathbox works! 🤗 + Let me explain how it works! 🤗

    - ), - footer: { - content: ( - <> -

    - Note: Later, I’ll explain why the village is named - after “lambda”, the 11th letter of the Greek alphabet. -

    - - ) - } + ) }, { title: <>How mathboxes work, @@ -99,16 +92,22 @@ export default () => ( Here’s an example mathbox:

    - Mathbox + A mathbox
      - There’s on the top, and + + There’s on the top + + , and - There’s a “plus 1” icon on the - bottom. + + There’s a “plus 1” icon on the + bottom. + + I’ll explain what these icons mean shortly!
    ( means…     - If you it, the - result will be {' '} - ➕ . + + If you it, the + result will be {' '} + ➕ . +
+ + If you it… + + - If you it, -
- the result will be {' '} - ➕ . + The result will be {' '} + ➕

This is the first feature of mathbox:{' '} @@ -214,9 +217,12 @@ export default () => ( ]} description={ <> - : + + + + :
- Add to some number + Adds to some number } /> @@ -274,7 +280,10 @@ export default () => ( ]} description={ <> - : + + + + :
Subtracts from some number @@ -293,12 +302,15 @@ export default () => ( content: ( <>

- Important: You can{' '} - - only use and{' '} - - {' '} - in mathboxes. + ⚠️ Important:{' '} + + You can{' '} + + only use and{' '} + + {' '} + in mathboxes. +

( Question: If you can only use{' '} and , then{' '} - + how do you calculate something like {' '} ➕ - {' '} - using a mathbox? - 🤔 + {' '} + using a mathbox? 🤔

(

Answer: To calculate {' '} ➕ ,{' '} - + use twice - {' '} + {' '} on .

( <>

Note: You can use both{' '} - + and{' '} as many times as you like - + . 😉

(

Takeaway: By using and{' '} many times, you can{' '} - + calculate any addition or subtraction, no matter how large the numbers are - {' '} + {' '} .

( Use ten times -

- Now you know how to add or subtract large numbers using a mathbox!{' '} - 😉 -

) }, @@ -517,11 +524,11 @@ export default () => ( content: ( <>

- Summary: A Mathbox is a{' '} - - magical tool that can calculate additions and subtractions - - . + Summary:{' '} + + A Mathbox is a magical tool that can calculate + additions and subtractions. +

( description={<>Mathboxes can do additions and subtractions} />

- Why mathboxes were important: The villagers in Lambda - Village were all very bad at math. They even had - to rely on mathboxes to calculate simple additions like{' '} - ➕{' '} + Why mathboxes were important:{' '} + + The villagers in Lambda Village were all{' '} + very bad at math. + {' '} + They even had to rely on mathboxes to calculate simple additions + like ➕{' '} .

( ]} description={ <> - We suck at math, so we must use mathboxes + “We suck at math, so we must use mathboxes
to do simple additions like {' '} - ➕ . + ➕ + .” } /> +

+ Therefore: The villagers couldn’t live without + mathboxes! +

), footer: { @@ -570,9 +585,8 @@ export default () => ( description={<>No multiplications or divisions} />

- However, for the villagers who all struggle with math, - mathboxes' ability to do addition and subtraction was better - than nothing. + However: For the villagers who all struggle with + additions and subtractions, mathboxes were still very useful.

) @@ -583,9 +597,12 @@ export default () => ( content: ( <>

- Next up: It turns out that mathboxes have{' '} - one more feature other than{' '} - and{' '} + Next up:{' '} + + It turns out that mathboxes have{' '} + one more feature + {' '} + other than and{' '} that we just described.

( description={<>A mathbox has one more feature…} />

- We’ll talk about this new feature on the next page!{' '} + We’ll talk about this third feature on the next page!{' '} 🤗

diff --git a/src/contents/10.en.tsx b/src/contents/10.en.tsx index 9c828002b..acf6ec17d 100644 --- a/src/contents/10.en.tsx +++ b/src/contents/10.en.tsx @@ -1147,7 +1147,7 @@ export default () => ( A mathbox that uses
can be “reproduced” using a - lunchbox. + lunchbox } /> diff --git a/src/contents/11.en.tsx b/src/contents/11.en.tsx index f79fc91da..fcea864af 100644 --- a/src/contents/11.en.tsx +++ b/src/contents/11.en.tsx @@ -186,7 +186,7 @@ export default () => (
to do additions and subtractions of
- large numbers. + large numbers } /> @@ -222,7 +222,7 @@ export default () => ( We might put the wrong number of
- ’s as the number gets large. + ’s as the number gets large } /> @@ -433,7 +433,7 @@ export default () => (
,{' '} , and{' '} - . + } /> @@ -622,8 +622,7 @@ export default () => ( children: ( <>

- I see - that’s why it becomes - ! + I see—that’s why it becomes !

) @@ -894,7 +893,7 @@ export default () => ( because the final result is{' '} conditioned on
- what’s in . + what’s in } /> diff --git a/src/contents/13.en.tsx b/src/contents/13.en.tsx index 2ea2336d8..7fc6a4067 100644 --- a/src/contents/13.en.tsx +++ b/src/contents/13.en.tsx @@ -846,7 +846,7 @@ export default () => ( children: ( <>

- Right. That’s what happened in the earlier example - the + Right. That’s what happened in the earlier example—the result was in either case.

diff --git a/src/contents/14.en.tsx b/src/contents/14.en.tsx index 93911b835..6de4657cd 100644 --- a/src/contents/14.en.tsx +++ b/src/contents/14.en.tsx @@ -48,8 +48,8 @@ export default () => ( content: ( <>

- In this episode, I’ll show you the most complicated lunchbox - you’ve seen. + In this page, I’ll show you the most complicated lunchbox you’ve + seen.

( cards={[ { type: 'summary', - title: <>This is the last advanced episode!, + title: <>This is the final advanced level!, content: ( <>

- This is the last page for the advanced levels! + This is the final page for the advanced levels! {' '} You’re almost there!

@@ -70,7 +70,9 @@ export default () => ( emojis={['🔁', '😈', '🔁']} description={ <> - We got back! + I will return +
+ to you! } /> @@ -105,7 +107,7 @@ export default () => ( <>

Finally, we can use mathboxes to do additions and - subtractions - no matter how difficult they are! + subtractions!

) @@ -137,15 +139,50 @@ export default () => ( children: ( <>

- Actually:{' '} + But guys… Do you really think it’s over + now? +

+ + ) + }, + { + type: 'roll', + children: ( + <> +

Hmm…?

+ + ) + }, + { + type: 'devil', + children: ( + <> +

+ Well, we are not done yet!{' '} +

+

- I have something I haven’t told you about. + I still have an important thing I haven’t told you + about. {' '} Let’s talk about it now!

) - }, + } + ]} + /> + + I still have an important thing +
I haven’t told you about! + + } + /> + ( <> Lunchboxes can do addition, multiplication,
- subtraction, and division. + subtraction, and division } /> diff --git a/src/contents/16.en.tsx b/src/contents/16.en.tsx index 79b431738..d3780e498 100644 --- a/src/contents/16.en.tsx +++ b/src/contents/16.en.tsx @@ -65,7 +65,7 @@ export default () => ( content: ( <>

- In the last episode, a villager from Lambda Village asked the + In the last page, a villager from Lambda Village asked the following question:

( />

However: Alonzo Church did not call - it “lunchbox” when he invented it. Instead, he called it “ + it a “lunchbox” when he invented it. Instead, he called it “ Lambda calculus”.

( <> It was called “Lambda calculus”
- instead of “lunchbox” + instead of a “lunchbox” } /> @@ -139,7 +139,7 @@ export default () => ( <>

Lambda calculus, invented by Alonzo Church, works - exactly like a lunchbox - although they look{' '} + exactly like a lunchbox—although they look{' '} different.

( />

Here is an example of lambda calculus. The leftmost - letter, λ, is a Greek letter - “lambda”. That’s why it’s called{' '} - “lambda calculus.” + letter, λ, is a Greek letter “ + lambda”. That’s why it’s called “ + lambda calculus.”

λA.B C

@@ -174,8 +174,7 @@ export default () => ( exactly the same as this lunchbox:

- If you the above - lunchbox, it will become 🅱️.{' '} + If you run the above lunchbox, it will become 🅱️.{' '}

@@ -183,7 +182,7 @@ export default () => ( Similarly: If you “run” the earlier lambda calculus expression,{' '} - the result will also be 🅱️. + the result will also be B.

λA.B C @@ -230,9 +229,9 @@ export default () => ( Y Combinator

- We had been talking about lunchboxes in this course.{' '} + We have been talking about lunchboxes in this course.{' '} - But in reality, we actually were talking about{' '} + But we really were talking about{' '} lambda calculus. {' '} We used lunchboxes to make lambda calculus more approachable for @@ -333,7 +332,7 @@ export default () => (
any calculations that can be
- done by today’s computers. + done by today’s computers } /> @@ -374,7 +373,7 @@ export default () => (
any calculations that can be
- done by today’s computers. + done by today’s computers } /> @@ -393,7 +392,7 @@ export default () => ( nodes={[ , , - 🍱 + 💻 ]} description={ <> @@ -408,8 +407,8 @@ export default () => ( Lambda calculus influenced many programming languages. {' '} - Popular programming languages people use today usually have a - feature inspired by lambda calculus. + Today’s popular programming languages usually have a feature that + originated from lambda calculus.

Example: Python is one @@ -422,7 +421,7 @@ export default () => ( />

The python language has a feature called{' '} - “lambda”, which is inspired by + “lambda”, which is similar to lambda calculus.

@@ -431,7 +430,7 @@ export default () => ( green {' '} - for Python code). + for the Python code).

(lambda A: A)('B') @@ -465,7 +464,7 @@ export default () => ( Summary:{' '} Today’s popular programming languages like Python have a feature - inspired by lambda calculus. + that originated from lambda calculus.

(
like Python have a feature
- inspired by lambda calculus. + that originated from lambda calculus } /> @@ -561,7 +560,7 @@ export default () => (
any calculations that can be
- done by today’s computers. + done by today’s computers } /> @@ -584,7 +583,7 @@ export default () => (
you can build a complex lunchbox
- that can do complex calculations. + that can do complex calculations } /> @@ -614,7 +613,7 @@ export default () => ( <> We can create a lunchbox that can
- repeat 🔁 some operations. + repeat 🔁 some calculations } /> @@ -622,8 +621,8 @@ export default () => ( Again: Computer science is all about building a complex thing from simple things.{' '} - I think lunchboxes - especially Y Combinator - are a great - example of this idea. + I think lunchboxes—especially Y Combinator—are a great example + of this idea. {' '} 😉

@@ -639,7 +638,7 @@ export default () => (
building a complex thing from simple things.
- Lunchboxes are a great example. + Lunchboxes are a great example } /> @@ -654,8 +653,8 @@ export default () => (

For example: If you study artificial intelligence, you’ll learn to build a “neural network”{' '} - 🧠 - a complex thing that can be used to process - images - by combining simple things called “neurons”{' '} + 🧠—a complex thing that can be used to process + images—by combining simple things called “neurons”{' '} .

( />

So hopefully this course gave you an idea of what learning - computer science is like. As you learn it, you’ll be surprised how - many innovations in computer science are built on lots of simple - things! + computer science is like. As you learn it, you’ll be surprised + that most innovative ideas in computer science are based on lots + of simple ideas!

) @@ -691,14 +690,16 @@ export default () => (
    - Lunchboxes are simple, but by combining them, you - can create a lunchbox that can do complex calculations. + 🍱 Lunchboxes are simple, but by + combining them, you can create a lunchbox that can do complex + calculations. Y Combinator is a special kind of a lunchbox that - allows you to repeat some calculations. + allows you to 🔁 repeat any + calculations. @@ -711,12 +712,15 @@ export default () => ( Computer science is all about building a complex - thing from simple things - - , and lunchboxes are a great example of this. + thing from simple things. + {' '} + Lunchboxes—especially Y Combinator—are a great example of this.
+

+ That’s it for this course! 🤗 +

), footer: { @@ -724,14 +728,16 @@ export default () => ( <> Try Y Combinator in the browser, + text: <>Test Y Combinator in devtools, content: ( <>

- Are you a programmer? If you’re a - programmer and are interested in trying out{' '} - Y Combinator, press “Try - Y Combinator in the browser” below! + If you’re a programmer and are interested + in trying out the{' '} + Y Combinator program, + press “Test Y Combinator in devtools” below. You need to + be on a desktop browser though—you can’t do it on a + smartphone.

) @@ -773,15 +779,15 @@ export default () => ( , which is the factorial of . - Also: If you change 4 on the + Also: If you change the 4 on the bottom to 5, it will calculate the factorial of{' '} , which is 120.

- Usually, to calculate the factorial of a number in JavaScript, - you’d use loops like for, while, or{' '} - reduce. Or you might use recursion. + To calculate the factorial of a number in JavaScript, you’d + usually use loops like for, while, + or reduce. Or you might use recursion.

diff --git a/src/contents/2.en.tsx b/src/contents/2.en.tsx index cef919af9..3ad1b13d8 100644 --- a/src/contents/2.en.tsx +++ b/src/contents/2.en.tsx @@ -60,8 +60,7 @@ export const Conclusion = () => ( ’s or ’s - . That means you can be confident that your additions and subtractions are - accurate. + . You can be confident that your additions and subtractions are accurate.

This is why{' '} @@ -159,17 +158,12 @@ export default () => ( nodes={[✨, 🔁, ✨]} description={ <> - + + + } /> -

- Let’s start with a{' '} - - - - ! -

) }, @@ -182,34 +176,49 @@ export default () => ( ), content: ( <> +

+ + We’ll start this page with a{' '} + + + + . + {' '} + It doesn’t matter if you get it right or wrong, so don’t worry too + much! +

+ We’ll do a Yes/No quiz!} + />

The villagers living in Lambda Village were all bad at math, so they had to rely on mathboxes to solve even the simplest problems.

- One day, a villager attempted to use a mathbox to calculate{' '} - ➖{' '} - . + One day:{' '} + + A villager needed to use a mathbox to calculate{' '} + ➖{' '} + . +

, ➖, - , - 🤔, - ❓ + ]} description={ <> - Need to calculate {' '} - ➖ … + 🤔 Need to calculate this… } />

So he came up with the following mathbox:

😉 This will calculate {' '} - ➖ . + ➖ !

Question:{' '} @@ -239,13 +248,15 @@ export default () => (

- So the result is .{' '} - + + So the result is . + {' '} + Instead of calculating {' '} ➖ , we calculated{' '} ➖{' '} by mistake - + .

( description={ <> Oops! It didn’t calculate {' '} - ➖ . + ➖ } /> @@ -277,10 +288,10 @@ export default () => ( ➖ instead of{' '} ➖{' '} is that{' '} - + there was the wrong number of ’s - + .

( If you wanted to calculate {' '} ➖ , you need to have{' '} eight - ’s. However, the previous mathbox actually had only{' '} - seven of them . + ’s. However,{' '} + + the previous mathbox only had seven of them. +

( ’s or ’s, then you won’t be able to calculate additions or subtractions - correctly. + correctly. 😭

Now, here’s a question:{' '} @@ -391,20 +404,26 @@ export default () => ( nodes={[✨, 🔁, ✨]} description={ <> - + + + } />

- Example: Take a look at this mathbox: + Example: Take a look at this mathbox that uses{' '} + :

- Important: There’s{' '} - - - {' '} - on the bottom-left, next to . + Notice that{' '} + + there’s{' '} + + + {' '} + on the bottom-left, next to . +

) @@ -420,11 +439,11 @@ export default () => (

If you the above mathbox,{' '} - + it automatically expands the bottom half before calculating the result - - . So after the expansion, there are now eight{' '} + + . After the expansion, there will be eight{' '} ’s.

@@ -433,21 +452,31 @@ export default () => ( + Before calculating the result: +
The bottom half automatically becomes
eight - ’s. + ’s +

+ So: The above mathbox calculates{' '} + ➖{' '} + and the result is{' '} + .{' '} + : +

+

Summary:{' '} - + If there’s{' '} {' '} next to , it repeats{' '} eight times - + .

( } />

- So: The above mathbox calculates{' '} - ➖{' '} - and the result is{' '} - .{' '} - : -

- -

- Takeaway: By using{' '} - ,{' '} + By using ,{' '} you can specify the number of times{' '} gets repeated @@ -506,10 +526,10 @@ export default () => ( content: ( <>

- + You can also repeat ’s - + . Take a look at this mathbox, and{' '} :

@@ -538,19 +558,32 @@ export default () => (
    - If there’s{' '} - - - {' '} - to the left of , then… + + If there’s{' '} + + + {' '} + to the left of , then… + - When you it,{' '} - gets repeated for{' '} - times. + + When you it,{' '} + gets repeated for{' '} + times. +
+

+ Of course, you can use instead of{' '} + as well. +

+ + gets repeated{' '} + times + +

So this is how{' '} @@ -562,18 +595,12 @@ export default () => ( nodes={[✨, 🔁, ✨]} description={ <> - + + + } /> -

- Of course, you can use instead of{' '} - as well. -

- - gets repeated{' '} - times - ) }, @@ -587,9 +614,11 @@ export default () => ( content: ( <>

- So: If you want to calculate 🅰️{' '} - ➕ 🅱️, you can use the following - mathbox: + So:{' '} + + If you want to calculate 🅰️ ➕{' '} + 🅱️, you can use the following mathbox: +

Calculates 🅰️ ➕ 🅱️ @@ -633,9 +662,11 @@ export default () => ( content: ( <>

- You can use the same technique for subtraction: To - calculate 🅰️ ➖ 🅱️,{' '} - use the following mathbox: + You can use the same technique for subtraction:{' '} + + To calculate 🅰️ ➖{' '} + 🅱️, use the following mathbox: +

Calculates 🅰️ ➖ 🅱️ @@ -656,9 +687,9 @@ export default () => ( content: ( <>

- As we mentioned earlier,{' '} + As we mentioned on the last page:{' '} - the villagers in Lambda Village were all very bad at math + The villagers in Lambda Village were all very bad at math . They had to rely on mathboxes to do even simple additions or subtractions. @@ -679,34 +710,12 @@ export default () => ( } /> -

- They were using - , , and{' '} - to do additions and - subtractions accurately. -

- , - , - 🔁 - ]} - description={ - <> - By combining these three features -
- of a mathbox, you can do -
- additions and subtractions accurately. - - } - />

However, one day, something terrible happened in Lambda Village that changed everything.

Something terrible happened!} />

We’ll talk about it on the next page!

diff --git a/src/contents/3.en.tsx b/src/contents/3.en.tsx index 9329b2d9f..b491abeb0 100644 --- a/src/contents/3.en.tsx +++ b/src/contents/3.en.tsx @@ -68,10 +68,10 @@ export default () => (

Don’t worry. I’m not here to take your lives away…

- + However, I will take all of your mathboxes{' '} . - {' '} + {' '} They’re all mine now!

@@ -80,11 +80,14 @@ export default () => ( }, { type: 'scared', + children:

What? No way!

+ }, + { + type: 'crying', children: ( -

- What? No way! You can’t take our mathboxes! That’s too - cruel! -

+ <> +

You can’t take our mathboxes! That’s too cruel!

+ ) } ]} @@ -97,8 +100,11 @@ export default () => ( content: ( <>

- And just like that: The devil has stolen{' '} - every single mathbox in Lambda Village. + And just like that:{' '} + + The devil has taken every single mathbox in + Lambda Village. +

( children: ( <>

- That’s exactly why I took away your mathboxes.{' '} + + That’s exactly why I took away your mathboxes. + {' '} It’s because you all are bad at math.

You see, your math skill hasn’t improved because you’re - relying on mathboxes to do even simple additions and - subtractions. + relying on mathboxes to do everything.

) @@ -175,8 +182,9 @@ export default () => ( I’m giving you an opportunity to finally study math - . You should thank me for it! + .

+

You should thank me for it!

) }, @@ -226,20 +234,19 @@ export default () => ( type: 'devil', children: ( <> +

+ How about … the puzzle challenge? +

- I’ll give you{' '} - - a bunch of puzzles that require lots of thinking. - {' '} + + I’ll give you some puzzles that require lots of + thinking. + {' '} If you can solve all of them, I’ll - give your mathboxes back. + give your mathboxes back!

-

- Since you all hadn’t spent much time studying, those - puzzles might be too hard for you. Haha! -

) }, @@ -255,9 +262,7 @@ export default () => ( type: 'brave', children: ( <> -

- But…we have to solve them to get our mathboxes back! -

+

But…we have to get our mathboxes back!

We’ll accept your challenge, the devil!

) @@ -274,11 +279,11 @@ export default () => ( />

So: The villagers are now on a mission to solve the - devil’s puzzles and get the stolen mathboxes back. + devil’s puzzles and get the mathboxes back.

Gotta get the mathboxes back!} + description={<>Let’s take back the mathboxes!} /> ) @@ -348,10 +353,11 @@ export default () => (

As you can see,{' '} - - each lunchbox has several sections, and each section - has some type of a food item. - + + each lunchbox has several sections, and + each section has some type of a food item + . +

) @@ -394,11 +400,15 @@ export default () => ( type: 'surprised', children: ( <> -

It looks like a Japanese lunchbox!

- + It looks like a Japanese lunchbox! +

+

+ It has 3 sections, each containing a food item. - + {' '} + It has and a{' '} + .

) @@ -473,13 +483,9 @@ export default () => ( type: 'devil', children: ( <> +

Yeah, they’re similar.

- Actually, is{' '} - related to mathboxes, but we’ll talk - about that later. -

-

- For now, let’s talk about how we can{' '} + Now, let’s talk about how we can{' '} {' '} ( <>

After running it,{' '} - + the bottom two {' '} disappeared, and only the {' '} is left! - +

) @@ -542,11 +548,14 @@ export default () => ( children: ( <>

- There is actually a{' '} - specific set of rules that determines - what happens when you{' '} - a - lunchbox. + Yes, and{' '} + + there is actually a{' '} + specific set of rules that determines + what happens when you{' '} + a + lunchbox. +

Your task is to{' '} @@ -561,11 +570,13 @@ export default () => ( emojis={['❓', '🍱', '❓']} description={ <> - There’s a specific set of rules for -
- . -
- Your task is to figure out what that is! + + There’s a specific set of rules for +
+ . +
+ Your task is to figure out what that is! + } /> @@ -581,6 +592,14 @@ export default () => (

) + }, + { + type: 'devil', + children: ( + <> +

Sure, let’s look at more examples.

+ + ) } ]} /> @@ -601,9 +620,10 @@ export default () => (

- This one has on the top and a{' '} + This one has on the top row and a{' '} and on - the bottom. : + the bottom row.{' '} + :

@@ -627,8 +647,10 @@ export default () => ( />

- Next, we’ll talk about the cases where there are{' '} - more than one item on the top row. + Next, we’ll talk about the cases where{' '} + + there are more than one item on the top row. +

This one has and{' '} @@ -656,7 +678,7 @@ export default () => (

- They all follow a pattern.{' '} + They all follow a pattern.{' '} Can you guess what that is?

( children: ( <>

- Just for your reference, here are the four lunchboxes - we’ve seen so far, and what happened when we ran them. + For your reference: Here are the four + lunchboxes we’ve seen so far, and what happened when we + ran them.

) @@ -749,7 +772,9 @@ export default () => ( Alright.{' '} Let’s do a then. - {' '} + +

+

I’ll check if you’ve figured out the pattern correctly!

diff --git a/src/contents/4.en.tsx b/src/contents/4.en.tsx index 5ad6bf55a..a561b5f04 100644 --- a/src/contents/4.en.tsx +++ b/src/contents/4.en.tsx @@ -11,6 +11,7 @@ import { } from 'src/components/ContentTags' import BottomRightBadge from 'src/components/BottomRightBadge' import TopLeftBadgeWrapper from 'src/components/TopLeftBadgeWrapper' +import TopLeftBadge from 'src/components/TopLeftBadge' import BubbleQuotes from 'src/components/BubbleQuotes' import EmojiSeparator from 'src/components/EmojiSeparator' import Emoji from 'src/components/Emoji' @@ -97,11 +98,13 @@ export const BasicRules = ({ export const Unmatched = () => ( <>

- If none of - ’s and - ’s match,{' '} + + If none of + ’s and + ’s match: + {' '} - don’t do the copy step and simply remove{' '} + Skip the copy step and simply remove{' '} ’s and ’s @@ -208,7 +211,7 @@ export default () => ( children: ( <>

- Let me explain. First,{' '} + Let me explain. First,{' '} you compare the bottom two items.

@@ -218,7 +221,7 @@ export default () => ( , then when you{' '} it,{' '} - we’re left with the top item + we’re left with the top row {' '} at the end.

@@ -381,13 +384,9 @@ export default () => ( children: ( <>

- You’re exactly right! Good job!{' '} + You’re exactly right! Good job!{' '} 🎉 🎉 🎉

-

- I thought you’ll do much worse on these quizzes because - you haven’t been studying math seriously. Not too bad! -

) }, @@ -413,7 +412,7 @@ export default () => ( type: 'scared', children: ( <> -

Huh? Why?

+

Huh? Why not?

) }, @@ -422,9 +421,12 @@ export default () => ( children: ( <>

- Before going to the next page, we still need to{' '} - formalize the rules of{' '} - . + Because:{' '} + + Before going to the next page, we still need to{' '} + formalize the rules of{' '} + . +

) @@ -455,17 +457,29 @@ export default () => ( children: ( <>

- Here’s what you stated: + Here are the patterns you discovered:

    - Compare the bottom two items. - If they’re the same, the top item remains. - Otherwise, the bottom-right item remains. + + Compare the bottom two items. + + + + If they’re the same, the top item remains. + + + + + Otherwise, the bottom-right item remains. + +

- This is not wrong but it also is{' '} - not detailed enough to solve more - difficult puzzles. + + They’re not wrong, but they are{' '} + not detailed enough to solve more + difficult puzzles. +

) @@ -509,9 +523,12 @@ export default () => ( children: ( <>

- So: I’ll explain to you the{' '} - formal, more detailed rules of{' '} - . + So:{' '} + + I’ll explain to you the formal, more + detailed rules of{' '} + . +

Once you understand it, I’ll give you more complex @@ -525,8 +542,8 @@ export default () => ( children: ( <>

- Okay… could you show me what the{' '} - formal rules look like? + Okay… show me what the formal rules{' '} + look like!

) @@ -580,7 +597,8 @@ export default () => ( { title: ( <> - 1. Label {' '} + Step 1. Label:{' '} + {' '} {' '} @@ -674,7 +692,8 @@ export default () => ( { title: ( <> - 2. Match {' '} + Step 2. Match:{' '} + {' '} {' '} ✅ @@ -734,7 +753,7 @@ export default () => ( { title: ( <> - 3. Copy:{' '} + Step 3. Copy:{' '} {' '} ↘️{' '} @@ -782,12 +801,11 @@ export default () => ( bottomRightBadgeType="callArg" /> ) is copied to where the matched{' '} - - - {' '} + {' '} + {' '} is!

@@ -801,7 +819,7 @@ export default () => ( { title: ( <> - 4. Remove: 💥{' '} + Step 4. Remove: 💥{' '} {' '} @@ -823,7 +841,7 @@ export default () => ( ’s and{' '} - ’s. + ’s } /> @@ -903,21 +921,22 @@ export default () => (

- Then, the match{' '} - ✅… + Then: The {' '} + match ✅…

- And therefore, both and - get copied to where the matched{' '} - - - {' '} - is. + Therefore:{' '} + + Both and{' '} + get copied to where the matched{' '} + {' '} + is. +

- Finally,{' '} + Finally:{' '} ’s and ’s disappear… @@ -991,7 +1010,7 @@ export default () => ( ), content: ( <> -

Let’s recap what we’ve learned so far:

+

Let’s review what we’ve learned so far:

( type: 'surprised', children: ( <> -

I see, now I understand fully what was going on.

+

I see, now I understand everything clearly!

) }, @@ -1009,10 +1028,10 @@ export default () => ( <>

Good. And{' '} - + by formalizing the rules in detail like this, we’ll be - able to solve more complex puzzles later. - + able to solve more complex puzzles. +

) @@ -1051,8 +1070,8 @@ export default () => ( children: ( <>

- But wait.{' '} - + But wait.{' '} + What happens if{' '} ( bottomRightBadgeType="funcBound" /> ’s don’t match? - {' '} + {' '} ❌

@@ -1129,16 +1148,18 @@ export default () => ( ) }, { - title: <>Let’s show all the steps, + title: <>Let’s go through all the steps, content: ( <>

- Review Time: Let’s show all the steps again - this - time for cases where{' '} - - ’s and{' '} - - ’s don’t match. + Review: Let’s go through all the steps again— + + this time for cases where{' '} + + ’s and{' '} + + ’s don’t match. +

( { title: ( <> - : 一致しなかった場合 + : If they don’t match ), type: 'summary', @@ -1206,8 +1227,9 @@ export default () => ( type: 'thinking', children: ( <> +

Ok…

- Alright. I understood them,{' '} + I understood them,{' '} but I haven’t fully memorized them yet.

@@ -1218,9 +1240,10 @@ export default () => ( children: ( <>

+ It’s ok. Don’t worry if you haven’t + memorized the rules.{' '} - Don’t worry if you haven’t memorized them. We’ll - review them again when we need them. + We’ll do a review when we use them later.

@@ -1230,9 +1253,10 @@ export default () => ( type: 'relieved', children: ( <> +

Oh, that’s good to hear.

- Oh, that’s good to hear. (Maybe the devil isn’t so evil - after all… 🤔) + (Maybe the devil isn’t so evil after all…{' '} + 🤔)

) @@ -1245,7 +1269,9 @@ export default () => ( On the next page, I’ll give you more challenging puzzles. - {' '} + +

+

If you want your mathboxes back, you better solve all of them!

diff --git a/src/contents/5.en.tsx b/src/contents/5.en.tsx index 438872810..857db4710 100644 --- a/src/contents/5.en.tsx +++ b/src/contents/5.en.tsx @@ -32,17 +32,18 @@ import { InstructionTwo } from 'src/contents/4.en' -const WillReturnQuote = () => ( +const WillReturnQuote = ({ covered }: { covered?: true }) => ( <>
    - On the intermediate levels, which start from the next - page, I’ll give you a very difficult question. + On the intermediate levels, which will start from the + next page, I’ll give you a very difficult question. - You’ll be able to solve it by applying the rules we cover on this page. + You’ll be able to solve it by applying the rules we cover + {covered && <>ed} on this page.

@@ -82,13 +83,13 @@ export const ThreeRowRules = () => (

    - Start with the pair of{' '} + Start with the pair of{' '} 1’s. - Label the middle item on the bottom row as{' '} + Label the middle item on the bottom row as{' '} , and ignore it. @@ -98,7 +99,8 @@ export const ThreeRowRules = () => ( After finishing the pair of{' '} 1’s, the pair of{' '} 2’s becomes{' '} - 1’s. Then, repeat. + 1’s.{' '} + Then, repeat.
@@ -142,7 +144,7 @@ export const Beginner5Rules = () => ( ) -const WillReturn = () => ( +const WillReturn = ({ covered }: { covered?: true }) => ( <> (
It can be solved by applying the rules
- we cover on this page. + we cover{covered && <>ed} on this page. } /> @@ -181,16 +183,16 @@ export default () => ( cards={[ { type: 'summary', - title: <>The last page of beginner levels, + title: <>This is the final beginner level!, content: ( <>

- This is the last page of beginner levels. Thank you - for following along so far! + This is the final page of the beginner levels. Thank + you for following along so far!

The last page of beginner levels!} + description={<>The final page of the beginner levels!} />

⚠️ Warning:{' '} @@ -222,8 +224,10 @@ export default () => ( children: ( <>

- From now on, you’ll be solving much harder puzzles like - this one: + + From now on, you’ll be solving much harder puzzles + like this one: +

) @@ -245,7 +249,9 @@ export default () => ( rows.

- But this one has 3 rows vertically. + + But this one has 3 rows vertically. +

) @@ -256,8 +262,10 @@ export default () => ( <>

Also,{' '} - there are 3 items on the bottom row:{' '} - , a{' '} + + there are 3 items on the bottom row + + : , a{' '} , and another{' '} .

@@ -274,12 +282,12 @@ export default () => ( <>

Right. Also, did you realize that{' '} - + there are numbers like{' '} 1 and{' '} 2 on the left edge? - +

) @@ -308,21 +316,24 @@ export default () => ( type: 'devil', children: ( <> -

- So, first:{' '} - - I’ll explain how to solve lunchbox puzzles with 3 - rows. - -

-

- Then:{' '} - - I will give you{' '} - to - solve. - -

+

I’ll show you!

+
    + + First:{' '} + + I’ll explain how to solve lunchbox puzzles with 3 + rows. + + + + Then:{' '} + + I will give you{' '} + {' '} + to solve. + + +
) }, @@ -349,13 +360,11 @@ export default () => ( content: ( <>

- - The first step in solving{' '} - with 3 - rows: - {' '} + The first step in solving{' '} + with 3 + rows is to{' '} - Focus on the pair of{' '} + focus on the pair of{' '} 1’s.

@@ -373,14 +382,11 @@ export default () => ( } />

- More specifically:{' '} + More specifically: You need to{' '} - Take a look at the{' '} - - sections that have a{' '} - 1 on its - top-left corner or bottom-left corner. - + take a look at the sections that have a{' '} + 1 on their{' '} + top-left corner or bottom-left corner.

@@ -411,23 +417,37 @@ export default () => ( type: 'devil', children: ( <> -

- Right. This means{' '} - - focus on the bottom 2 rows, which - correspond to the pair of{' '} - - 1 - - ’s, and ignore the top row{' '} - for now. - -

+

Right. This means:

+
    + + + Focus on{' '} + the bottom 2 rows, which correspond + to the pair of{' '} + + 1 + + ’s, + {' '} + and + + + + Ignore the top row for + now. + + +
) } ]} /> + + Focus on the bottom 2 rows, and +
+ Ignore the top row for now + ) }, @@ -443,7 +463,7 @@ export default () => ( content: ( <>

- Next, we add the labels.{' '} + Next: we add the labels.{' '}

@@ -454,7 +474,7 @@ export default () => ( children: ( <>

- Wait a minute: In addition to{' '} + In addition to{' '} (

) - }, + } + ]} + /> + + There’s a new label{' '} + +
+ for the ! + + ( /> , , + , ]} description={ @@ -577,7 +607,7 @@ export default () => (

Answer:{' '} - You can ignore{' '} + You can ignore{' '} ’s for now. @@ -621,19 +651,19 @@ export default () => (

- + None of them involves{' '} - + .{' '} - So, while we do these next steps, you can ignore{' '} + So, while we do these next steps, you can ignore{' '} ’s.

- Ignore the labeled as{' '} + Ignore the labeled as{' '}
for the next several steps @@ -721,7 +751,7 @@ export default () => ( children: ( <>

- I see - that’s why we can ignore{' '} + I see—that’s why we can ignore{' '} ( type: 'surprised', children: ( <> -

- This now looks like lunchboxes from the previous page! -

+

We now hae a simpler lunchbox!

) } @@ -818,14 +846,14 @@ export default () => ( But{' '} - - it will now be labeled as{' '} + + it is now labeled as{' '} - - , because it’s on the “Left” now. + {' '} + because it’s on the “Left” now. @@ -880,7 +908,7 @@ export default () => ( type: 'thinking', children: ( <> -

I think so?

+

Hmm… I might need to look at it one more time.

) }, @@ -1060,22 +1088,14 @@ export default () => ( children: ( <>

- Not yet. I still haven’t given you + Not yet. I still haven’t given you questions regarding the{' '} additional rules of a lunchbox.

) - } - ]} - /> - The additional rules…?} - /> - (

) - }, + } + ]} + /> + The additional rules…?} + /> + ( <>

Hmm… this is new.{' '} - + There are two pairs of{' '} 1’s - + .

@@ -1140,10 +1168,10 @@ export default () => ( <>

This one looks new too.{' '} - + There’s only ONE item (a ) on the bottom row. - +

) @@ -1177,9 +1205,9 @@ export default () => ( emojis={['❓', '🍱', '❓']} description={ <> - You need the additional rules to + You need know the additional rules
- solve puzzles like the above + to solve puzzles like the above } /> @@ -1190,8 +1218,8 @@ export default () => ( children: ( <>

- There are two additional rules you need - to know. + There are two additional rules you need to + know.

After explaining them, I’ll give you more{' '} @@ -1216,7 +1244,7 @@ export default () => ( type: 'devil', children: ( <> -

Well:

+

Well, here’s the deal…

) @@ -1296,11 +1324,8 @@ export default () => (

- Then, here’s a question: What will happen to the - labels? {' '} - {' '} - {' '} - + 🤔 Now, you might be wondering: What + labels do we use?

( , ]} + description={ + <> + What labels do we use? + + } />

- First, the top will be labeled as{' '} + First: The top will be + labeled as{' '} .

- Next, the bottom-left will be labeled - as . + Second: The bottom-left {' '} + will be labeled as{' '} + .

- Next, the right and the right{' '} - will be labeled as{' '} + >Third: The right and + the right will be labeled as{' '} .

@@ -1829,7 +1861,7 @@ export default () => ( children: ( <>

- Yes - we can’t take any more steps, so that’s where we + Yes. We can’t take any more steps, so that’s where we stop.

@@ -2023,17 +2055,32 @@ export default () => ( Good for you! And you’ve just completed the beginner levels.

+ + ) + }, + { + type: 'celebrate', + children: ( + <> +

Yay!

+ + ) + }, + { + type: 'devil', + children: ( + <>

Next up: Intermediate levels. As I mentioned earlier:

- + ) } ]} /> - + ( 1 {' '} - のペアの部分、すなわち下の2つの段に注目し、上の段{' '} - {' '} - の部分は無視する + のペアの部分、すなわち下の2つの段に注目し、上の段は無視する ということだ。

@@ -367,6 +365,7 @@ export default () => ( } ]} /> + 下の2つの段に注目し、上の段は無視する ) }, @@ -410,7 +409,20 @@ export default () => (

) - }, + } + ]} + /> + + 下段真ん中の には、 +
+ {' '} + の印がついた！ + + ( /> , , + , ]} description={ diff --git a/src/contents/6.en.tsx b/src/contents/6.en.tsx index dcf8dd684..a4a241904 100644 --- a/src/contents/6.en.tsx +++ b/src/contents/6.en.tsx @@ -118,7 +118,7 @@ export default () => (

- But: The mathboxes were stolen by the devil{' '} + But: The mathboxes were taken by the devil{' '} 😈. To take them back, we must solve{' '} diff --git a/src/contents/8.en.tsx b/src/contents/8.en.tsx index 3eda23c79..366594067 100644 --- a/src/contents/8.en.tsx +++ b/src/contents/8.en.tsx @@ -119,7 +119,7 @@ export default () => ( <>

Hi Saya. Well, we have some bad news. The devil{' '} - 😈 has stolen our mathboxes{' '} + 😈 has taken our mathboxes{' '} .

@@ -560,7 +560,7 @@ export default () => ( description={ <> Last time, became{' '} - . + } /> @@ -799,7 +799,7 @@ export default () => ( becomes , and
- becomes . + becomes } />{' '} @@ -1043,7 +1043,7 @@ export default () => ( A mathbox that uses
can be “reproduced” using a - lunchbox. + lunchbox } /> @@ -1269,7 +1269,7 @@ export default () => ( A mathbox that uses
can be “reproduced” using a - lunchbox. + lunchbox } /> diff --git a/src/contents/9.en.tsx b/src/contents/9.en.tsx index 83d92d86b..6a4df5996 100644 --- a/src/contents/9.en.tsx +++ b/src/contents/9.en.tsx @@ -492,7 +492,7 @@ export default () => ( ,
- then the results change. + then the results change } /> @@ -787,7 +787,7 @@ export default () => ( ,
- then the results change. + then the results change } /> @@ -937,7 +937,7 @@ export default () => ( ]} description={ <> - Can we use this special rule: + Can we use this special rule?
If the same item appears in
@@ -948,7 +948,7 @@ export default () => ( /> and{' '} ,
- change one of them to something different. + change one of them to something different } /> diff --git a/src/lib/date.tsx b/src/lib/date.tsx index 4b3fa8317..ff4f7e40a 100644 --- a/src/lib/date.tsx +++ b/src/lib/date.tsx @@ -3,7 +3,7 @@ import { DateTime } from 'luxon' export const date = { jp: DateTime.fromISO('2019-09-09T00:00:00Z'), - en: DateTime.fromISO('2019-10-31T12:00:00Z') + en: DateTime.fromISO('2019-10-30T12:00:00Z') }[locale] export const dateString = { diff --git a/src/lib/runners/bcgp.json b/src/lib/runners/bcgp.json new file mode 100644 index 000000000..599e73c72 --- /dev/null +++ b/src/lib/runners/bcgp.json @@ -0,0 +1,111 @@ +{ + "expressionContainers": [ + { + "expression": { + "arg": { + "name": "d", + "highlightType": "default", + "topLeftBadgeType": "none", + "bottomRightBadgeType": "none", + "type": "variable", + "argPriorityAgg": [ + 2 + ], + "funcPriorityAgg": [], + "emphasizePriority": false, + "bound": true, + "maxNestedFunctionDepth": 0 + }, + "func": { + "arg": { + "name": "c", + "highlightType": "active", + "topLeftBadgeType": "none", + "bottomRightBadgeType": "callArg", + "type": "variable", + "argPriorityAgg": [ + 1 + ], + "funcPriorityAgg": [], + "emphasizePriority": true, + "bound": true, + "maxNestedFunctionDepth": 0 + }, + "func": { + "arg": { + "name": "a", + "highlightType": "active", + "topLeftBadgeType": "none", + "bottomRightBadgeType": "funcArg", + "type": "variable", + "argPriorityAgg": [], + "funcPriorityAgg": [ + 1, + 2 + ], + "emphasizePriority": true, + "bound": false, + "maxNestedFunctionDepth": 0 + }, + "body": { + "arg": { + "name": "b", + "highlightType": "active", + "topLeftBadgeType": "none", + "bottomRightBadgeType": "funcUnbound", + "type": "variable", + "argPriorityAgg": [], + "funcPriorityAgg": [], + "emphasizePriority": false, + "bound": false, + "maxNestedFunctionDepth": 0 + }, + "body": { + "name": "a", + "highlightType": "active", + "topLeftBadgeType": "none", + "bottomRightBadgeType": "funcBound", + "type": "variable", + "argPriorityAgg": [], + "funcPriorityAgg": [], + "emphasizePriority": false, + "bound": true, + "maxNestedFunctionDepth": 0 + }, + "type": "function", + "maxNestedFunctionDepth": 1 + }, + "type": "function", + "maxNestedFunctionDepth": 2 + }, + "state": "showFuncUnbound", + "type": "call", + "priority": 1, + "maxNestedFunctionDepth": 2 + }, + "state": "default", + "type": "call", + "priority": 2, + "maxNestedFunctionDepth": 2 + }, + "numLeafNodes": 3, + "containerState": "stepped", + "previouslyChangedExpressionState": "showFuncUnbound", + "activePriority": 1 + } + ], + "speed": 1, + "hideControls": true, + "explanationsVisibility": "hidden", + "hidePriorities": false, + "hideRunButton": false, + "hideBottomRightBadges": false, + "skipToTheEnd": false, + "hideFuncUnboundBadgeOnExplanation": false, + "highlightOverridesCallArgAndFuncUnboundOnly": false, + "bottomRightBadgeOverrides": {}, + "highlightOverrides": {}, + "highlightOverrideActiveAfterStart": false, + "highlightFunctions": false, + "showBottomProgressBar": false +} diff --git a/src/lib/theme/lineHeights.ts b/src/lib/theme/lineHeights.ts index 665845c2a..e8ba12a47 100644 --- a/src/lib/theme/lineHeights.ts +++ b/src/lib/theme/lineHeights.ts @@ -4,7 +4,7 @@ export const allLineHeights = { 1: 1, 1.1: 1.1, 1.3: 1.3, - 1.5: 1.5, + 1.55: 1.55, 2: 2 }