diff --git a/beta/public/images/team/acdlite.jpg b/beta/public/images/team/acdlite.jpg index f6d10f290..19ddb901f 100644 Binary files a/beta/public/images/team/acdlite.jpg and b/beta/public/images/team/acdlite.jpg differ diff --git a/beta/public/images/team/bvaughn.jpg b/beta/public/images/team/bvaughn.jpg deleted file mode 100644 index 227fe8d94..000000000 Binary files a/beta/public/images/team/bvaughn.jpg and /dev/null differ diff --git a/beta/public/images/team/gaearon.jpg b/beta/public/images/team/gaearon.jpg index e152143b7..dff5a5173 100644 Binary files a/beta/public/images/team/gaearon.jpg and b/beta/public/images/team/gaearon.jpg differ diff --git a/beta/public/images/team/huxpro.jpg b/beta/public/images/team/huxpro.jpg deleted file mode 100644 index f9a94452e..000000000 Binary files a/beta/public/images/team/huxpro.jpg and /dev/null differ diff --git a/beta/public/images/team/jasonbonta.jpg b/beta/public/images/team/jasonbonta.jpg new file mode 100644 index 000000000..139eb5ece Binary files /dev/null and b/beta/public/images/team/jasonbonta.jpg differ diff --git a/beta/public/images/team/joe.jpg b/beta/public/images/team/joe.jpg new file mode 100644 index 000000000..7eb702e79 Binary files /dev/null and b/beta/public/images/team/joe.jpg differ diff --git a/beta/public/images/team/josh.jpg b/beta/public/images/team/josh.jpg new file mode 100644 index 000000000..ebed23562 Binary files /dev/null and b/beta/public/images/team/josh.jpg differ diff --git a/beta/public/images/team/lauren.jpg b/beta/public/images/team/lauren.jpg new file mode 100644 index 000000000..1485cf8ff Binary files /dev/null and b/beta/public/images/team/lauren.jpg differ diff --git a/beta/public/images/team/lunaruan.jpg b/beta/public/images/team/lunaruan.jpg index 91daa3d17..f6de76d4e 100644 Binary files a/beta/public/images/team/lunaruan.jpg and b/beta/public/images/team/lunaruan.jpg differ diff --git a/beta/public/images/team/mofei-zhang.png b/beta/public/images/team/mofei-zhang.png new file mode 100644 index 000000000..9f957ada3 Binary files /dev/null and b/beta/public/images/team/mofei-zhang.png differ diff --git a/beta/public/images/team/necolas.jpg b/beta/public/images/team/necolas.jpg deleted file mode 100644 index b7caaac06..000000000 Binary files a/beta/public/images/team/necolas.jpg and /dev/null differ diff --git a/beta/public/images/team/rickhanlonii.jpg b/beta/public/images/team/rickhanlonii.jpg index eb04614c5..9165db5bc 100644 Binary files a/beta/public/images/team/rickhanlonii.jpg and b/beta/public/images/team/rickhanlonii.jpg differ diff --git a/beta/public/images/team/rnabors.jpg b/beta/public/images/team/rnabors.jpg deleted file mode 100644 index 4425c90db..000000000 Binary files a/beta/public/images/team/rnabors.jpg and /dev/null differ diff --git a/beta/public/images/team/salazarm.jpeg b/beta/public/images/team/salazarm.jpeg deleted file mode 100644 index 0360f208d..000000000 Binary files a/beta/public/images/team/salazarm.jpeg and /dev/null differ diff --git a/beta/public/images/team/sam.jpg b/beta/public/images/team/sam.jpg new file mode 100644 index 000000000..f73474b91 Binary files /dev/null and b/beta/public/images/team/sam.jpg differ diff --git a/beta/public/images/team/sathya.jpg b/beta/public/images/team/sathya.jpg new file mode 100644 index 000000000..3d8ca7d58 Binary files /dev/null and b/beta/public/images/team/sathya.jpg differ diff --git a/beta/public/images/team/sebmarkbage.jpg b/beta/public/images/team/sebmarkbage.jpg index 56a480ff4..b73e13cd7 100644 Binary files a/beta/public/images/team/sebmarkbage.jpg and b/beta/public/images/team/sebmarkbage.jpg differ diff --git a/beta/public/images/team/sebsilbermann.jpg b/beta/public/images/team/sebsilbermann.jpg new file mode 100644 index 000000000..f6fa04b37 Binary files /dev/null and b/beta/public/images/team/sebsilbermann.jpg differ diff --git a/beta/public/images/team/sethwebster.jpg b/beta/public/images/team/seth.jpg similarity index 100% rename from beta/public/images/team/sethwebster.jpg rename to beta/public/images/team/seth.jpg diff --git a/beta/public/images/team/sophiebits.jpg b/beta/public/images/team/sophiebits.jpg new file mode 100644 index 000000000..da5548aca Binary files /dev/null and b/beta/public/images/team/sophiebits.jpg differ diff --git a/beta/public/images/team/threepointone.jpg b/beta/public/images/team/threepointone.jpg deleted file mode 100644 index 9ad860171..000000000 Binary files a/beta/public/images/team/threepointone.jpg and /dev/null differ diff --git a/beta/public/images/team/tianyu.jpg b/beta/public/images/team/tianyu.jpg new file mode 100644 index 000000000..aeb6ed9fa Binary files /dev/null and b/beta/public/images/team/tianyu.jpg differ diff --git a/beta/public/images/team/trueadm.jpg b/beta/public/images/team/trueadm.jpg deleted file mode 100644 index 33a6b838f..000000000 Binary files a/beta/public/images/team/trueadm.jpg and /dev/null differ diff --git a/beta/src/components/Icon/IconLink.tsx b/beta/src/components/Icon/IconLink.tsx new file mode 100644 index 000000000..587b4e6ed --- /dev/null +++ b/beta/src/components/Icon/IconLink.tsx @@ -0,0 +1,25 @@ +/* + * Copyright (c) Facebook, Inc. and its affiliates. + */ + +import {memo} from 'react'; + +export const IconLink = memo(function IconLink( + props +) { + return ( + + + + ); +}); diff --git a/beta/src/components/MDX/MDXComponents.tsx b/beta/src/components/MDX/MDXComponents.tsx index 845185cbd..8269e47e0 100644 --- a/beta/src/components/MDX/MDXComponents.tsx +++ b/beta/src/components/MDX/MDXComponents.tsx @@ -29,6 +29,7 @@ import {IconNavArrow} from '../Icon/IconNavArrow'; import ButtonLink from 'components/ButtonLink'; import {TocContext} from './TocContext'; import type {Toc, TocItem} from './TocContext'; +import {TeamMember} from './TeamMember'; function CodeStep({children, step}: {children: any; step: number}) { return ( @@ -398,6 +399,7 @@ export const MDXComponents = { Recap, Recipes, Sandpack, + TeamMember, TerminalBlock, YouWillLearn, YouWillLearnCard, diff --git a/beta/src/components/MDX/TeamMember.tsx b/beta/src/components/MDX/TeamMember.tsx new file mode 100644 index 000000000..887e9f691 --- /dev/null +++ b/beta/src/components/MDX/TeamMember.tsx @@ -0,0 +1,98 @@ +/* + * Copyright (c) Facebook, Inc. and its affiliates. + */ + +import * as React from 'react'; +import Image from 'next/image'; +import {IconTwitter} from '../Icon/IconTwitter'; +import {IconGitHub} from '../Icon/IconGitHub'; +import {ExternalLink} from '../ExternalLink'; +import {IconNewPage} from 'components/Icon/IconNewPage'; +import {H3} from './Heading'; +import {IconLink} from 'components/Icon/IconLink'; + +interface TeamMemberProps { + name: string; + title: string; + permalink: string; + children: React.ReactNode; + photo: string; + twitter?: string; + github?: string; + personal?: string; +} + +// TODO: good alt text for images/links +export function TeamMember({ + name, + title, + permalink, + children, + photo, + github, + twitter, + personal, +}: TeamMemberProps) { + if (name == null || title == null || permalink == null || children == null) { + throw new Error( + 'Expected name, title, permalink, and children for ' + name ?? + title ?? + permalink ?? + 'unknown' + ); + } + return ( +
+
+
+ {name} +
+
+ {name} +
+
+

+ {name} +

+ {title &&
{title}
} + {children} +
+ {twitter && ( +
+ + + {twitter} + +
+ )} + {github && ( +
+ + {github} + +
+ )} + {personal && ( + + {personal} + + )} +
+
+
+
+ ); +} diff --git a/beta/src/content/learn/acknowledgements.md b/beta/src/content/learn/acknowledgements.md index 909585002..2ee6ab499 100644 --- a/beta/src/content/learn/acknowledgements.md +++ b/beta/src/content/learn/acknowledgements.md @@ -17,6 +17,7 @@ We'd like to recognize a few people who have made significant contributions to R * [Alex Krolick](https://github.com/alexkrolick) * [Alexey Pyltsyn](https://github.com/lex111) * [Brandon Dail](https://github.com/aweary) +* [Brian Vaughn](https://github.com/bvaughn) * [Caleb Meredith](https://github.com/calebmer) * [Chang Yan](https://github.com/cyan33) * [Cheng Lou](https://github.com/chenglou) @@ -33,19 +34,23 @@ We'd like to recognize a few people who have made significant contributions to R * [Joe Critchley](https://github.com/joecritch) * [Jeff Morrison](https://github.com/jeffmo) * [Keyan Zhang](https://github.com/keyz) +* [Marco Salazar](https://github.com/salazarm) * [Nat Alison](https://github.com/tesseralis) * [Nathan Hunzaker](https://github.com/nhunzaker) * [Nicolas Gallagher](https://github.com/necolas) * [Paul O'Shannessy](https://github.com/zpao) * [Pete Hunt](https://github.com/petehunt) * [Philipp Spiess](https://github.com/philipp-spiess) +* [Rachel Nabors](https://github.com/rachelnabors) * [Robert Zhang](https://github.com/robertzhidealx) * [Sander Spies](https://github.com/sanderspies) * [Sasha Aickin](https://github.com/aickin) +* [Seth Webster](https://github.com/sethwebster) * [Sophia Shoemaker](https://github.com/mrscobbler) * [Sophie Alpert](https://github.com/sophiebits) * [Sunil Pai](https://github.com/threepointone) * [Tim Yung](https://github.com/yungsters) +* [Xuan Huang](https://github.com/huxpro) * [Yuzhi Zheng](https://github.com/yuzhi) This list is not exhaustive. diff --git a/beta/src/content/learn/meet-the-team.md b/beta/src/content/learn/meet-the-team.md index e2dd3f980..2063b1b9d 100644 --- a/beta/src/content/learn/meet-the-team.md +++ b/beta/src/content/learn/meet-the-team.md @@ -3,7 +3,7 @@ -React development is led by a small dedicated team working full time at Facebook. It also receives contributions from people all over the world. +React development is led by a dedicated team working full time at Meta. It also receives contributions from people all over the world. @@ -13,85 +13,73 @@ The React Core team members work full time on the core component APIs, the engin Current members of the React team are listed in alphabetical order below. -### Andrew Clark {/*andrew-clark*/} + + Andrew got started with web development by making sites with WordPress, and eventually tricked himself into doing JavaScript. His favorite pastime is karaoke. Andrew is either a Disney villain or a Disney princess, depending on the day. + -![Andrew Clark](../images/team/acdlite.jpg) + + Dan got into programming after he accidentally discovered Visual Basic inside Microsoft PowerPoint. He has found his true calling in turning [Sebastian](#sebastian-markbåge)'s tweets into long-form blog posts. Dan occasionally wins at Fortnite by hiding in a bush until the game ends. + -[@acdlite on GitHub](https://github.com/acdlite) · [@acdlite on Twitter](https://twitter.com/acdlite) + + Jason likes having large volumes of Amazon packages delivered to the office so that he can build forts. Despite literally walling himself off from his team at times and not understanding how for-of loops work, we appreciate him for the unique qualities he brings to his work. + -Andrew got started with web development by making sites with WordPress, and eventually tricked himself into doing JavaScript. His favorite pastime is karaoke. Andrew is either a Disney villain or a Disney princess, depending on the day. + + Joe was planning to major in math and philosophy but got into computer science after writing physics simulations in Matlab. Prior to React, he worked on Relay, RSocket.js, and the Skip programming language. While he’s not building some sort of reactive system he enjoys running, studying Japanese, and spending time with his family. + -### Brian Vaughn {/*brian-vaughn*/} + + Josh majored in Mathematics and discovered programming while in college. His first professional developer job was to program insurance rate calculations in Microsoft Excel, the paragon of Reactive Programming which must be why he now works on React. In between that time Josh has been an IC, Manager, and Executive at a few startups. outside of work he likes to push his limits with cooking. + -![Brian Vaughn](../images/team/bvaughn.jpg) + + Lauren’s programming career peaked when she first discovered the `` tag. She’s been chasing that high ever since. When she’s not adding bugs into React, she enjoys dropping cheeky memes in chat, and playing all too many video games with her partner and dog Zelda. + -[@bvaughn on GitHub](https://github.com/bvaughn) · [@brian\_d\_vaughn on Twitter](https://twitter.com/brian_d_vaughn) + + Luna learned programming because she thought it meant creating video games. Instead, she ended up working on the Pinterest web app, and now on React itself. Luna doesn't want to make video games anymore, but she plans to do creative writing if she ever gets bored. + -Brian studied art in college and did programming on the side to pay for his education. Eventually, he realized that he enjoys working on open source. Brian has one [one-person band](https://soundcloud.com/brianvaughn/) and two [two-person](https://soundcloud.com/pilotlessdrone) [bands.](https://soundcloud.com/pinwurm) He also takes care of the cutest cat in the world. + + Mofei started programming when she realized it can help her cheat in video games. She focused on operating systems in undergrad / grad school, but now finds herself happily tinkering on React. Outside of work, she enjoys debugging bouldering problems and planning her next backpacking trip(s). + -### Dan Abramov {/*dan-abramov*/} + + Ricky majored in theoretical math and somehow found himself on the React Native team for a couple years before joining the React team. When he's not programming you can find him snowboarding, biking, climbing, golfing, or closing GitHub issues that do not match the issue template. + -![Dan Abramov](../images/team/gaearon.jpg) + + Samuel’s interest in programming started with the movie Matrix. He still has Matrix screen saver. Before working on React, he was focused on writing iOS apps. Outside of work, Samuel enjoys playing beach volleyball, squash, badminton and spending time with his family. + -[@gaearon on GitHub](https://github.com/gaearon) · [@dan_abramov on Twitter](https://twitter.com/dan_abramov) + + Sathya hated the Dragon Book in school but somehow ended up working on compilers all his career. When he's not compiling React components, he's either drinking coffee or eating yet another Dosa. + -Dan got into programming after he accidentally discovered Visual Basic inside Microsoft PowerPoint. He has found his true calling in turning [Sebastian](#sebastian-markbåge)'s tweets into long-form blog posts. Dan occasionally wins at Fortnite by hiding in a bush until the game ends. + + Sebastian majored in psychology. He's usually quiet. Even when he says something, it often doesn't make sense to the rest of us until a few months later. The correct way to pronounce his surname is "mark-boa-geh" but he settled for "mark-beige" out of pragmatism -- and that's how he approaches React. + -### Luna Ruan {/*luna-ruan*/} + + Sebastian learned programming to make the browser games he played during class more enjoyable. Eventually this lead to contributing to as much open source code as possible. Outside of coding he's busy making sure people don't confuse him with the other Sebastians and Zilberman of the React community. + -![Luna](../images/team/lunaruan.jpg) + + Seth started programming as a kid growing up in Tucson, AZ. After school, he was bitten by the music bug and was a touring musician for about 10 years before returning to *work*, starting with Intuit. In his spare time, he loves [taking pictures](https://www.sethwebster.com) and flying for animal rescues in the northeastern United States. + -[@lunaruan on GitHub](https://github.com/lunaruan) · [@lunaruan on Twitter](https://twitter.com/lunaruan) + + Four days after React was released, Sophie rewrote the entirety of her then-current project to use it, which she now realizes was perhaps a bit reckless. After she became the project's #1 committer, she wondered why she wasn't getting paid by Facebook like everyone else was and joined the team officially to lead React through its adolescent years. Though she quit that job years ago, somehow she's still in the team's group chats and “providing value”. + -Luna learned programming because she thought it meant creating video games. Instead, she ended up working on the Pinterest web app, and now on React itself. Luna doesn't want to make video games anymore, but she plans to do creative writing if she ever gets bored. + + Tianyu’s interest in computers started as a kid because he loves video games. So he majored in computer science and still plays childish games like League of Legends. When he is not in front of a computer, he enjoys playing with his two kittens, hiking and kayaking. + -### Marco Salazar {/*marco-salazar*/} - -![Marco](../images/team/salazarm.jpeg) - -[@salazarm on GitHub](https://github.com/salazarm) · [@BkOptimism on Twitter](https://twitter.com/BkOptimism) - -Marco's first programming language was Assembly because he could use it to hack video games. Now online games are much more secure so he settles for playing fairly (mostly). In his spare time he plays games on his treadmill desk and makes art that he never finishes. Hopefully his PRs don't have the same fate. - -### Rachel Nabors {/*rachel-nabors*/} - -![Rachel](../images/team/rnabors.jpg) - -[@rachelnabors on GitHub](https://github.com/rachelnabors) · [@rachelnabors on Twitter](https://twitter.com/rachelnabors) - -Rachel wrote a [book about UI animation](https://abookapart.com/products/animation-at-work) once and worked with MDN and the W3C on the web animations API. Now she is busy with education materials and community engineering on the React team. Secretly, she is an award-winning cartoonist for teenage girls. Catch her making fancy tea with lukewarm water in the microkitchen. - -### Rick Hanlon {/*rick-hanlon*/} - -![Ricky](../images/team/rickhanlonii.jpg) - -[@rickhanlonii on GitHub](https://github.com/rickhanlonii) · [@rickhanlonii on Twitter](https://twitter.com/rickhanlonii) - -Ricky majored in theoretical math and somehow found himself on the React Native team for a couple years before joining the React team. When he's not programming you can find him snowboarding, biking, climbing, golfing, or closing GitHub issues that do not match the issue template. - -### Sebastian Markbåge {/*sebastian-markbåge*/} - -![Sebastian](../images/team/sebmarkbage.jpg) - -[@sebmarkbage on GitHub](https://github.com/sebmarkbage) · [@sebmarkbage on Twitter](https://twitter.com/sebmarkbage) - -Sebastian majored in psychology. He's usually quiet. Even when he says something, it often doesn't make sense to the rest of us until a few months later. The correct way to pronounce his surname is "mark-boa-geh" but he settled for "mark-beige" out of pragmatism -- and that's how he approaches React. - -### Seth Webster {/*seth-webster*/} - -![Seth](../images/team/sethwebster.jpg) - -[@sethwebster on GitHub](https://github.com/sethwebster) · [@sethwebster on Twitter](https://twitter.com/sethwebster) - -Seth started programming as a kid growing up in Tucson, AZ. After school, he was bitten by the music bug and was a touring musician for about 10 years before returning to *work*, starting with Intuit. In his spare time, he loves [taking pictures](https://www.sethwebster.com) and flying for animal rescues in the northeastern United States. - -### Xuan Huang {/*xuan-huang*/} - -![Xuan](../images/team/huxpro.jpg) - -[@huxpro on GitHub](https://github.com/huxpro) · [@huxpro on Twitter](https://twitter.com/huxpro) - -Xuan met with programming in childhood to make games in Flash. He did digital media arts in college but eventually got tricked into making compilers, and somehow React needs one. Out of work, he pours terrible latte arts and plays tennis either on or off a table. + + Yuzhi studied Computer Science in school. She liked the instant gratification of seeing code come to life without having to physically be in a laboratory. Now she’s a manager in the React org. Before management, she used to work on the Relay data fetching framework. In her spare time, Yuzhi enjoys optimizing her life via gardening and home improvement projects. + ## Past contributors {/*past-contributors*/} diff --git a/beta/src/utils/prepareMDX.js b/beta/src/utils/prepareMDX.js index 5dd15d622..639d7db90 100644 --- a/beta/src/utils/prepareMDX.js +++ b/beta/src/utils/prepareMDX.js @@ -12,7 +12,7 @@ export const PREPARE_MDX_CACHE_BREAKER = 2; // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ export function prepareMDX(rawChildren) { - const toc = getTableOfContents(rawChildren); + const toc = getTableOfContents(rawChildren, /* depth */ 10); const children = wrapChildrenInMaxWidthContainers(rawChildren); return {toc, children}; } @@ -59,35 +59,9 @@ function wrapChildrenInMaxWidthContainers(children) { return finalChildren; } -function getTableOfContents(children) { - const anchors = Children.toArray(children) - .filter((child) => { - if (child.type) { - return ['h1', 'h2', 'h3', 'Challenges', 'Recap'].includes(child.type); - } - return false; - }) - .map((child) => { - if (child.type === 'Challenges') { - return { - url: '#challenges', - depth: 2, - text: 'Challenges', - }; - } - if (child.type === 'Recap') { - return { - url: '#recap', - depth: 2, - text: 'Recap', - }; - } - return { - url: '#' + child.props.id, - depth: (child.type && parseInt(child.type.replace('h', ''), 0)) ?? 0, - text: child.props.children, - }; - }); +function getTableOfContents(children, depth) { + const anchors = []; + extractHeaders(children, depth, anchors); if (anchors.length > 0) { anchors.unshift({ url: '#', @@ -97,3 +71,47 @@ function getTableOfContents(children) { } return anchors; } + +const headerTypes = new Set([ + 'h1', + 'h2', + 'h3', + 'Challenges', + 'Recap', + 'TeamMember', +]); +function extractHeaders(children, depth, out) { + for (const child of Children.toArray(children)) { + if (child.type && headerTypes.has(child.type)) { + let header; + if (child.type === 'Challenges') { + header = { + url: '#challenges', + depth: 2, + text: 'Challenges', + }; + } else if (child.type === 'Recap') { + header = { + url: '#recap', + depth: 2, + text: 'Recap', + }; + } else if (child.type === 'TeamMember') { + header = { + url: '#' + child.props.permalink, + depth: 3, + text: child.props.name, + }; + } else { + header = { + url: '#' + child.props.id, + depth: (child.type && parseInt(child.type.replace('h', ''), 0)) ?? 0, + text: child.props.children, + }; + } + out.push(header); + } else if (child.children && depth > 0) { + extractHeaders(child.children, depth - 1, out); + } + } +} diff --git a/content/community/team.md b/content/community/team.md index 9091648bf..1952b5dbc 100644 --- a/content/community/team.md +++ b/content/community/team.md @@ -6,7 +6,7 @@ sectionid: community permalink: community/team.html --- -React development is led by a small dedicated team working full time at Facebook. It also receives contributions from people all over the world. +React development is led by a small dedicated team working full time at Meta. It also receives contributions from people all over the world. ## Meet the React Team {#meet-the-react-team} @@ -22,14 +22,6 @@ Current members of the React team are listed in alphabetical order below. Andrew got started with web development by making sites with WordPress, and eventually tricked himself into doing JavaScript. His favorite pastime is karaoke. Andrew is either a Disney villain or a Disney princess, depending on the day. -### Brian Vaughn {#brian-vaughn} - -![Brian Vaughn](../images/team/bvaughn.jpg) - -[@bvaughn on GitHub](https://github.com/bvaughn) · [@brian\_d\_vaughn on Twitter](https://twitter.com/brian_d_vaughn) - -Brian studied art in college and did programming on the side to pay for his education. Eventually, he realized that he enjoys working on open source. Brian has one [one-person band](https://soundcloud.com/brianvaughn/) and two [two-person](https://soundcloud.com/pilotlessdrone) [bands](https://soundcloud.com/pinwurm). He also takes care of the cutest cat in the world. - ### Dan Abramov {#dan-abramov} ![Dan Abramov](../images/team/gaearon.jpg) @@ -38,6 +30,36 @@ Brian studied art in college and did programming on the side to pay for his educ Dan got into programming after he accidentally discovered Visual Basic inside Microsoft PowerPoint. He has found his true calling in turning [Sebastian](#sebastian-markbage)'s tweets into long-form blog posts. Dan occasionally wins at Fortnite by hiding in a bush until the game ends. +### Jason Bonta {#jason-bonta} + +![Jason Bonta](../images/team/jasonbonta.jpg) + +Jason likes having large volumes of Amazon packages delivered to the office so that he can build forts. Despite literally walling himself off from his team at times and not understanding how for-of loops work, we appreciate him for the unique qualities he brings to his work. + +### Joe Savona {#joe-savona} + +![Joe Savona](../images/team/joe.jpg) + +[@josephsavona on GitHub](https://github.com/josephsavona) · [@en_JS on Twitter](https://twitter.com/en_JS) + +Joe was planning to major in math and philosophy but got into computer science after writing physics simulations in Matlab. Prior to React, he worked on Relay, RSocket.js, and the Skip programming language. While he’s not building some sort of reactive system he enjoys running, studying Japanese, and spending time with his family. + +### Josh Story {#josh-story} + +![Josh Story](../images/team/josh.jpg) + +[@gnoff on GitHub](https://github.com/gnoff) · [@joshcstory on Twitter](https://twitter.com/joshcstory) + +Josh majored in Mathematics and discovered programming while in college. His first professional developer job was to program insurance rate calculations in Microsoft Excel, the paragon of Reactive Programming which must be why he now works on React. In between that time Josh has been an IC, Manager, and Executive at a few startups. outside of work he likes to push his limits with cooking. + +### Lauren Tan {#lauren-tan} + +![Lauren](../images/team/lauren.jpg) + +[@poteto on GitHub](https://github.com/poteto) · [@potetotes on Twitter](https://twitter.com/potetotes) + +Lauren’s programming career peaked when she first discovered the `` tag. She’s been chasing that high ever since. When she’s not adding bugs into React, she enjoys dropping cheeky memes in chat, and playing all too many video games with her partner and dog Zelda. + ### Luna Ruan {#luna-ruan} ![Luna](../images/team/lunaruan.jpg) @@ -46,21 +68,13 @@ Dan got into programming after he accidentally discovered Visual Basic inside Mi Luna learned programming because she thought it meant creating video games. Instead, she ended up working on the Pinterest web app, and now on React itself. Luna doesn't want to make video games anymore, but she plans to do creative writing if she ever gets bored. -### Marco Salazar {#marco-salazar} +### Mofei Zhang {#mofei-zhang} -![Marco](../images/team/salazarm.jpeg) +![Mofei](../images/team/mofei-zhang.png) -[@salazarm on GitHub](https://github.com/salazarm) · [@BkOptimism on Twitter](https://twitter.com/BkOptimism) +[@mofeiZ on GitHub](https://github.com/mofeiZ)] -Marco's first programming language was Assembly because he could use it to hack video games. Now online games are much more secure so he settles for playing fairly (mostly). In his spare time he plays games on his treadmill desk and makes art that he never finishes. Hopefully his PRs don't have the same fate. - -### Rachel Nabors {#rachel-nabors} - -![Rachel](../images/team/rnabors.jpg) - -[@rachelnabors on GitHub](https://github.com/rachelnabors) · [@rachelnabors on Twitter](https://twitter.com/rachelnabors) - -Rachel wrote a [book about UI animation](https://abookapart.com/products/animation-at-work) once and worked with MDN and the W3C on the web animations API. Now she is busy with education materials and community engineering on the React team. Secretly, she is an award-winning cartoonist for teenage girls. Catch her making fancy tea with lukewarm water in the microkitchen. +Mofei started programming when she realized it can help her cheat in video games. She focused on operating systems in undergrad / grad school, but now finds herself happily tinkering on React. Outside of work, she enjoys debugging bouldering problems and planning her next backpacking trip(s). ### Rick Hanlon {#rick-hanlon} @@ -70,6 +84,22 @@ Rachel wrote a [book about UI animation](https://abookapart.com/products/animati Ricky majored in theoretical math and somehow found himself on the React Native team for a couple years before joining the React team. When he's not programming you can find him snowboarding, biking, climbing, golfing, or closing GitHub issues that do not match the issue template. +### Samuel Susla {#samuel-susla} + +![Samuel Susla](../images/team/sam.jpg) + +[@sammy-SC on GitHub](https://github.com/sammy-SC) · [@SamuelSusla on Twitter](https://twitter.com/SamuelSusla) + +Samuel’s interest in programming started with the movie Matrix. He still has Matrix screen saver. Before working on React, he was focused on writing iOS apps. Outside of work, Samuel enjoys playing beach volleyball, squash, badminton and spending time with his family. + +### Sathya Gunasekaran {#sathya-gunasekaran} + +![Sathya Gunasekaran](../images/team/sathya.jpg) + +[@gsathya on GitHub](https://github.com/gsathya) · [@_gsathya on Twitter](https://twitter.com/_gsathya) + +Sathya hated the Dragon Book in school but somehow ended up working on compilers all his career. When he's not compiling React components, he's either drinking coffee or eating yet another Dosa. + ### Sebastian Markbåge {#sebastian-markbage} ![Sebastian](../images/team/sebmarkbage.jpg) @@ -78,21 +108,45 @@ Ricky majored in theoretical math and somehow found himself on the React Native Sebastian majored in psychology. He's usually quiet. Even when he says something, it often doesn't make sense to the rest of us until a few months later. The correct way to pronounce his surname is "mark-boa-geh" but he settled for "mark-beige" out of pragmatism -- and that's how he approaches React. +### Sebastian Silbermann {#sebastian-silbermann} + +![Sebastian Silbermann](../images/team/sebsilbermann.jpg) + +[@eps1lon on GitHub](https://github.com/eps1lon) · [@sebsilbermann on Twitter](https://twitter.com/sebsilbermann) + +Sebastian learned programming to make the browser games he played during class more enjoyable. Eventually this lead to contributing to as much open source code as possible. Outside of coding he's busy making sure people don't confuse him with the other Sebastians and Zilberman of the React community. + ### Seth Webster {#seth-webster} -![Seth](../images/team/sethwebster.jpg) +![Seth](../images/team/seth.jpg) [@sethwebster on GitHub](https://github.com/sethwebster) · [@sethwebster on Twitter](https://twitter.com/sethwebster) Seth started programming as a kid growing up in Tucson, AZ. After school, he was bitten by the music bug and was a touring musician for about 10 years before returning to *work*, starting with Intuit. In his spare time, he loves [taking pictures](https://www.sethwebster.com) and flying for animal rescues in the northeastern United States. -### Xuan Huang {#xuan-huang} +### Sophie Alpert {#sophie-alpert} -![Xuan](../images/team/huxpro.jpg) +![Sophie](../images/team/sophiebits.jpg) -[@huxpro on GitHub](https://github.com/huxpro) · [@huxpro on Twitter](https://twitter.com/huxpro) +[@sophiebits on GitHub](https://github.com/sophiebits) · [@sophiebits on Twitter](https://twitter.com/sophiebits) -Xuan met with programming in childhood to make games in Flash. He did digital media arts in college but eventually got tricked into making compilers, and somehow React needs one. Out of work, he pours terrible latte arts and plays tennis either on or off a table. +Four days after React was released, Sophie rewrote the entirety of her then-current project to use it, which she now realizes was perhaps a bit reckless. After she became the project's #1 committer, she wondered why she wasn't getting paid by Facebook like everyone else was and joined the team officially to lead React through its adolescent years. Though she quit that job years ago, somehow she's still in the team's group chats and “providing value”. + +### Tianyu Yao {#tianyu-yao} + +![Tianyu Yao](../images/team/tianyu.jpg) + +[@tyao1 on GitHub](https://github.com/tyao1) · [@tianyu0 on Twitter](https://twitter.com/tianyu0) + +Tianyu’s interest in computers started as a kid because he loves video games. So he majored in computer science and still plays childish games like League of Legends. When he is not in front of a computer, he enjoys playing with his two kittens, hiking and kayaking. + +### Yuzhi Zheng {#yuzhi-zheng} + +![Yuzhi](../images/team/yuzhi.jpg) + +[@yuzhi on GitHub](https://github.com/yuzhi) · [@yuzhiz on Twitter](https://twitter.com/yuzhiz) + +Yuzhi studied Computer Science in school. She liked the instant gratification of seeing code come to life without having to physically be in a laboratory. Now she’s a manager in the React org. Before management, she used to work on the Relay data fetching framework. In her spare time, Yuzhi enjoys optimizing her life via gardening and home improvement projects. ## Acknowledgements {#acknowledgements} @@ -103,6 +157,7 @@ React was originally created by [Jordan Walke](https://github.com/jordwalke). To * [Alex Krolick](https://github.com/alexkrolick) * [Alexey Pyltsyn](https://github.com/lex111) * [Brandon Dail](https://github.com/aweary) +* [Brian Vaughn](https://github.com/bvaughn) * [Caleb Meredith](https://github.com/calebmer) * [Chang Yan](https://github.com/cyan33) * [Cheng Lou](https://github.com/chenglou) @@ -119,20 +174,21 @@ React was originally created by [Jordan Walke](https://github.com/jordwalke). To * [Joe Critchley](https://github.com/joecritch) * [Jeff Morrison](https://github.com/jeffmo) * [Keyan Zhang](https://github.com/keyz) +* [Marco Salazar](https://github.com/salazarm) * [Nat Alison](https://github.com/tesseralis) * [Nathan Hunzaker](https://github.com/nhunzaker) * [Nicolas Gallagher](https://github.com/necolas) * [Paul O'Shannessy](https://github.com/zpao) * [Pete Hunt](https://github.com/petehunt) * [Philipp Spiess](https://github.com/philipp-spiess) +* [Rachel Nabors](https://github.com/rachelnabors) * [Robert Zhang](https://github.com/robertzhidealx) * [Sander Spies](https://github.com/sanderspies) * [Sasha Aickin](https://github.com/aickin) * [Sophia Shoemaker](https://github.com/mrscobbler) -* [Sophie Alpert](https://github.com/sophiebits) * [Sunil Pai](https://github.com/threepointone) * [Tim Yung](https://github.com/yungsters) -* [Yuzhi Zheng](https://github.com/yuzhi) +* [Xuan Huang](https://github.com/huxpro) This list is not exhaustive. diff --git a/content/images/team/acdlite.jpg b/content/images/team/acdlite.jpg index f6d10f290..19ddb901f 100644 Binary files a/content/images/team/acdlite.jpg and b/content/images/team/acdlite.jpg differ diff --git a/content/images/team/bvaughn.jpg b/content/images/team/bvaughn.jpg deleted file mode 100644 index 227fe8d94..000000000 Binary files a/content/images/team/bvaughn.jpg and /dev/null differ diff --git a/content/images/team/gaearon.jpg b/content/images/team/gaearon.jpg index e152143b7..dff5a5173 100644 Binary files a/content/images/team/gaearon.jpg and b/content/images/team/gaearon.jpg differ diff --git a/content/images/team/huxpro.jpg b/content/images/team/huxpro.jpg deleted file mode 100644 index f9a94452e..000000000 Binary files a/content/images/team/huxpro.jpg and /dev/null differ diff --git a/content/images/team/jasonbonta.jpg b/content/images/team/jasonbonta.jpg new file mode 100644 index 000000000..139eb5ece Binary files /dev/null and b/content/images/team/jasonbonta.jpg differ diff --git a/content/images/team/joe.jpg b/content/images/team/joe.jpg new file mode 100644 index 000000000..0a533830b Binary files /dev/null and b/content/images/team/joe.jpg differ diff --git a/content/images/team/josh.jpg b/content/images/team/josh.jpg new file mode 100644 index 000000000..a3d1ff10d Binary files /dev/null and b/content/images/team/josh.jpg differ diff --git a/content/images/team/lauren.jpg b/content/images/team/lauren.jpg new file mode 100644 index 000000000..1485cf8ff Binary files /dev/null and b/content/images/team/lauren.jpg differ diff --git a/content/images/team/lunaruan.jpg b/content/images/team/lunaruan.jpg index 91daa3d17..f6de76d4e 100644 Binary files a/content/images/team/lunaruan.jpg and b/content/images/team/lunaruan.jpg differ diff --git a/content/images/team/mofei-zhang.png b/content/images/team/mofei-zhang.png new file mode 100644 index 000000000..9f957ada3 Binary files /dev/null and b/content/images/team/mofei-zhang.png differ diff --git a/content/images/team/necolas.jpg b/content/images/team/necolas.jpg deleted file mode 100644 index b7caaac06..000000000 Binary files a/content/images/team/necolas.jpg and /dev/null differ diff --git a/content/images/team/rickhanlonii.jpg b/content/images/team/rickhanlonii.jpg index eb04614c5..9165db5bc 100644 Binary files a/content/images/team/rickhanlonii.jpg and b/content/images/team/rickhanlonii.jpg differ diff --git a/content/images/team/rnabors.jpg b/content/images/team/rnabors.jpg deleted file mode 100644 index 4425c90db..000000000 Binary files a/content/images/team/rnabors.jpg and /dev/null differ diff --git a/content/images/team/salazarm.jpeg b/content/images/team/salazarm.jpeg deleted file mode 100644 index 0360f208d..000000000 Binary files a/content/images/team/salazarm.jpeg and /dev/null differ diff --git a/content/images/team/sam.jpg b/content/images/team/sam.jpg new file mode 100644 index 000000000..1a23eb1d5 Binary files /dev/null and b/content/images/team/sam.jpg differ diff --git a/content/images/team/sathya.jpg b/content/images/team/sathya.jpg new file mode 100644 index 000000000..3d8ca7d58 Binary files /dev/null and b/content/images/team/sathya.jpg differ diff --git a/content/images/team/sebmarkbage.jpg b/content/images/team/sebmarkbage.jpg index 56a480ff4..b73e13cd7 100644 Binary files a/content/images/team/sebmarkbage.jpg and b/content/images/team/sebmarkbage.jpg differ diff --git a/content/images/team/sebsilbermann.jpg b/content/images/team/sebsilbermann.jpg new file mode 100644 index 000000000..f6fa04b37 Binary files /dev/null and b/content/images/team/sebsilbermann.jpg differ diff --git a/content/images/team/sethwebster.jpg b/content/images/team/seth.jpg similarity index 100% rename from content/images/team/sethwebster.jpg rename to content/images/team/seth.jpg diff --git a/content/images/team/sophiebits.jpg b/content/images/team/sophiebits.jpg new file mode 100644 index 000000000..da5548aca Binary files /dev/null and b/content/images/team/sophiebits.jpg differ diff --git a/content/images/team/threepointone.jpg b/content/images/team/threepointone.jpg deleted file mode 100644 index 9ad860171..000000000 Binary files a/content/images/team/threepointone.jpg and /dev/null differ diff --git a/content/images/team/tianyu.jpg b/content/images/team/tianyu.jpg new file mode 100644 index 000000000..68e423527 Binary files /dev/null and b/content/images/team/tianyu.jpg differ diff --git a/content/images/team/trueadm.jpg b/content/images/team/trueadm.jpg deleted file mode 100644 index 33a6b838f..000000000 Binary files a/content/images/team/trueadm.jpg and /dev/null differ