├── netlify.toml ├── src ├── index.md ├── assets │ ├── sesh-url.png │ ├── sesh-edit.png │ ├── avatar-fallback.jpg │ ├── favicon │ │ ├── favicon.ico │ │ ├── favicon-16x16.png │ │ ├── favicon-32x32.png │ │ ├── mstile-150x150.png │ │ ├── apple-touch-icon.png │ │ ├── android-chrome-192x192.png │ │ ├── android-chrome-512x512.png │ │ ├── browserconfig.xml │ │ ├── site.webmanifest │ │ └── safari-pinned-tab.svg │ └── sesh-screenshot.png ├── posts │ └── posts.json ├── schedule │ ├── schedule.json │ ├── 2021-06-02-among-us.md │ ├── 2021-08-13-svelte-and-sveltekit.md │ ├── 2021-11-08-build-css-apis-with-attribute-selectors.md │ ├── 2021-06-04-lets-build-discord-bots.md │ ├── 2021-06-15-some-antics-figma.md │ ├── 2021-07-20-some-antics-auditing.md │ ├── 2021-07-27-some-antics-disabling-buttons.md │ ├── 2021-06-08-some-antics-github-navigation.md │ ├── 2021-07-12-some-antics-safari-15-features.md │ ├── 2021-06-01-some-antics-postgres.md │ ├── 2021-06-22-some-antics-elementor.md │ ├── 2021-12-09-frontend-horse-migrating-to-react-18.md │ ├── 2021-06-29-some-antics-accessibility-for-3d-in-react-three-fiber.md │ ├── 2021-05-11-some-antics-building-a-navigation-component-with-chantastic.md │ ├── 2021-11-18-learn-with-jason-styling-with-attribute-selectors.md │ ├── 2021-05-28-localize-datetimes-in-eleventy-with-js.md │ ├── 2021-07-09-some-antics-prismic.md │ ├── 2021-03-16-fix-dst-dates-in-eleventy.md │ ├── 2021-06-18-simplifying-the-data-layer-with-prisma.md │ ├── 2021-07-09-remix-run-thru.md │ ├── 2022-01-03-january-kickoff.md │ ├── 2021-03-16-react-in-3d.md │ ├── 2021-11-08-space-age-real-time-networking.md │ ├── 2021-03-30-some-antics-a11y-ama.md │ ├── 2021-05-04-some-antics-interactive-games-powered-by-twitch-chat.md │ ├── 2021-07-06-some-antics-vite.md │ ├── 2020-12-22-ui-reproduction-interview-challenge.md │ ├── 2021-06-11-react-18-twitter-space-party.md │ ├── 2020-12-21-eleventy-community-calendar.md │ ├── 2021-01-15-create-social-cards-with-open-graph-and-cloudinary.md │ ├── 2021-04-05-querying-a-graphql-api.md │ ├── 2021-04-13-some-antics-test-driven-development-with-adrianne-mallett.md │ ├── 2021-01-14-data-fetching-with-server-components.md │ ├── 2021-02-10-using-storybook-with-redwood.md │ ├── 2021-03-16-some-antics-specs-tests-and-mocks.md │ ├── 2021-04-28-some-antics-web-components-with-andy-bell.md │ ├── 2021-07-21-state-of-the-react-ecosystem-with-this-dot.md │ ├── 2021-03-26-remix.md │ ├── 2021-02-26-extend-your-workflow-with-e2e-testing--cypress.md │ ├── 2021-05-27-nextjs-conf-multiplayer-cursors.md │ ├── 2021-06-16-feature-content-by-date-in-eleventy-using-custom-filters.md │ ├── 2021-10-15-october-lightning-talks.md │ ├── 2021-07-08-learning-and-teaching-react-with-egghead.md │ ├── 2021-05-18-some-antics-getting-started-automated-a11y-testing.md │ ├── 2021-08-02-mastermind-monday.md │ ├── 2021-11-10-upc-lookup.md │ ├── 2021-03-02-thinking-in-react-with-keith-elliott.md │ ├── 2021-04-20-some-antics-design-systems-with-ashlae-nelms.md │ ├── 2021-03-03-singlethreaded-faduma-mohammed-on-code-reviews--compliments.md │ ├── 2021-09-02-typescript-in-50-lessons-chapter-2b.md │ ├── 2021-02-08-add-calendar-links-to-11ty-with-computed-data.md │ ├── 2021-02-25-the-power-of-mental-models-with-maggie-appleton.md │ ├── 2021-04-06-some-antics-personalizing-with-joe-lamyman.md │ ├── 2021-04-21-singlethreaded-s1-finale.md │ ├── 2021-03-04-react-spring-with-paul-henschel.md │ ├── 2021-02-23-some-antics-accessible-svgs.md │ ├── 2021-05-14-create-posts-in-eleventy-using-collections.md │ ├── 2020-12-14-eleventy-at-11.md │ ├── 2020-12-28-style-community-calendar.md │ ├── 2021-03-23-some-antics-accessible-routing-in-redwoodjs.md │ ├── 2021-05-21-attribute-speakers-using-githubs-avatar-api.md │ ├── 2021-04-14-singlethreaded-jeff-lembeck-hero-culture.md │ ├── 2021-01-29-eleventy-contributors-page.md │ ├── 2021-02-24-singlethreaded-crystal-martin-on-the-value-of-i-dont-know.md │ ├── 2021-04-09-taylor-swift-escape-room.md │ ├── 2021-01-21-get-access-with-aaron-cannon.md │ ├── 2021-01-26-some-antics-redwoodjs-tutorials.md │ ├── 2021-04-08-mentorship-and-codingcoachio-with-emma-bostian.md │ ├── 2021-02-18-concurrent-mode-with-andrew-clark.md │ ├── 2021-01-20-add-youtube-and-twitter-shortcodes-to-eleventy.md │ ├── 2021-02-17-singlethreaded-erin-fox-on-interviewing.md │ ├── 2021-03-31-singlethreaded-carolyn-stransky-crying-at-work.md │ ├── 2021-02-04-jamison-dance-on-soft-skills-and-creating-react-rally.md │ ├── 2021-02-11-build-dumb-shit-with-sara-vieira.md │ ├── 2021-03-25-communicate-with-your-audience-with-val-geisler.md │ ├── 2021-03-24-singlethreaded-lauren-tan-individual-contributors-vs-engineering-managers.md │ ├── 2021-03-18-typescript-graphql-elm-and-product-thinking-with-chris-toomey.md │ ├── 2021-01-28-code-and-trust-with-saron-yitbarek.md │ ├── 2021-01-07-twitch-overlays.md │ ├── 2021-01-15-add-social-cards-to-eleventy-site.md │ ├── 2021-04-07-styling-and-component-libraries-round-table.md │ ├── 2021-05-05-advice-to-my-younger-self-round-table.md │ ├── schedule.11tydata.js │ ├── 2021-04-23-lightning.md │ ├── 2021-01-19-hijacking-screenreaders-with-css.md │ ├── 2021-08-12-typeScript-in-50-lessons-book-club-intro.md │ ├── 2021-08-19-typescript-in-50-lessons-chapter-1.md │ └── 2021-08-26-typescript-in-50-lessons-chapter-2a.md ├── _includes │ ├── partials │ │ ├── analytics.html │ │ ├── header.html │ │ ├── calendar.svg │ │ ├── favicon.html │ │ ├── calendarLinks.html │ │ ├── microsoftoffice.svg │ │ ├── microsoftoutlook.svg │ │ ├── googlecalendar.svg │ │ ├── join-discord-button.html │ │ ├── event-sesh-command.html │ │ └── footer.html │ └── layouts │ │ ├── page.html │ │ ├── post.html │ │ ├── homepage.html │ │ └── event.html ├── _data │ ├── contributors.js │ ├── contributions.json │ ├── someAntics.js │ └── people.json ├── js │ └── localize-dates.js ├── utils │ ├── person.js │ ├── get-twitch-channel-embed.js │ └── get-youtube-video-embed.js ├── css │ ├── navbar.css │ ├── events.css │ ├── reset.css │ ├── footer.css │ ├── homepage.css │ ├── styles.css │ └── elements.css ├── contributors.liquid ├── sesh.md └── code-of-conduct.md ├── utils ├── event-types.js ├── index.js └── print-emoji-ribbon.js ├── .gitignore ├── .prettierrc ├── _redirects ├── .github └── workflows │ └── main.yml ├── package.json ├── .eleventy.js ├── cli └── index.js ├── .all-contributorsrc └── README.md /netlify.toml: -------------------------------------------------------------------------------- 1 | [build.environment] 2 | TZ='America/Los_Angeles' -------------------------------------------------------------------------------- /src/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: layouts/homepage.html 3 | --- 4 | -------------------------------------------------------------------------------- /utils/event-types.js: -------------------------------------------------------------------------------- 1 | module.exports = ['Talk', 'Episode Party', 'Mob Job', 'Live Event']; 2 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | yarn.lock 3 | package-lock.json 4 | _site/ 5 | .idea/ 6 | **/.DS_Store 7 | .cache -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 120, 3 | "singleQuote": true, 4 | "useTabs": true, 5 | "tabWidth": 2 6 | } 7 | -------------------------------------------------------------------------------- /src/assets/sesh-url.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/sesh-url.png -------------------------------------------------------------------------------- /src/posts/posts.json: -------------------------------------------------------------------------------- 1 | { 2 | "layout": "layouts/post.html", 3 | "permalink": "/post/{{ page.fileSlug }}/" 4 | } 5 | -------------------------------------------------------------------------------- /src/schedule/schedule.json: -------------------------------------------------------------------------------- 1 | { 2 | "layout": "layouts/event.html", 3 | "permalink": "/{{ page.fileSlug }}/" 4 | } 5 | -------------------------------------------------------------------------------- /src/assets/sesh-edit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/sesh-edit.png -------------------------------------------------------------------------------- /src/_includes/partials/analytics.html: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /src/assets/avatar-fallback.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/avatar-fallback.jpg -------------------------------------------------------------------------------- /src/assets/favicon/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/favicon.ico -------------------------------------------------------------------------------- /src/assets/sesh-screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/sesh-screenshot.png -------------------------------------------------------------------------------- /utils/index.js: -------------------------------------------------------------------------------- 1 | exports.EVENT_TYPES = require('./event-types'); 2 | exports.printEmojiRibbon = require('./print-emoji-ribbon'); 3 | -------------------------------------------------------------------------------- /src/assets/favicon/favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/favicon-16x16.png -------------------------------------------------------------------------------- /src/assets/favicon/favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/favicon-32x32.png -------------------------------------------------------------------------------- /src/assets/favicon/mstile-150x150.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/mstile-150x150.png -------------------------------------------------------------------------------- /src/assets/favicon/apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/apple-touch-icon.png -------------------------------------------------------------------------------- /src/assets/favicon/android-chrome-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/android-chrome-192x192.png -------------------------------------------------------------------------------- /src/assets/favicon/android-chrome-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/LunchDevCommunity/community-calendar/HEAD/src/assets/favicon/android-chrome-512x512.png -------------------------------------------------------------------------------- /utils/print-emoji-ribbon.js: -------------------------------------------------------------------------------- 1 | const emoji = require('node-emoji'); 2 | 3 | module.exports = (type = 'banana', count = 18) => [...new Array(count)].map((_) => emoji.get(type)).join(''); 4 | -------------------------------------------------------------------------------- /_redirects: -------------------------------------------------------------------------------- 1 | /discord https://discord.gg/dx7ZWCy 2 | /youtube https://www.youtube.com/channel/UCB5V77aiP0pz7RVbfQrbr7Q 3 | /analytics https://app.usefathom.com/share/bdcmttnp/events.lunch.dev 4 | -------------------------------------------------------------------------------- /src/_includes/partials/header.html: -------------------------------------------------------------------------------- 1 | 8 | -------------------------------------------------------------------------------- /src/schedule/2021-06-02-among-us.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Among Us Game Night' 3 | type: Live Event 4 | date: 2021-06-03 03:00:00 5 | --- 6 | 7 | Someone in the [React Podcast Discord server](https://events.lunch.dev/discord) is acting pretty sus… 8 | -------------------------------------------------------------------------------- /src/schedule/2021-08-13-svelte-and-sveltekit.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Svelte and SvelteKit' 3 | type: Talk 4 | date: 2021-08-13 17:00:00 5 | speakers: 6 | - Austin Crim 7 | --- 8 | 9 | Come join us for an introduction to Svelte and SvelteKit! 10 | -------------------------------------------------------------------------------- /src/schedule/2021-11-08-build-css-apis-with-attribute-selectors.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'lunchdev: Build CSS APIs with Attribute Selectors' 3 | type: Live Event 4 | date: 2021-11-08 18:00:00 5 | speakers: 6 | - Michael Chan 7 | url: https://www.twitch.tv/lunchdev 8 | --- 9 | -------------------------------------------------------------------------------- /src/schedule/2021-06-04-lets-build-discord-bots.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Let's Build Discord Bots!" 3 | type: Talk 4 | date: 2021-06-04 18:00:00 5 | speakers: 6 | - Devon 7 | --- 8 | 9 | Come join us for a lunch session as Devon shows us how to build Discord bots! 10 | -------------------------------------------------------------------------------- /src/schedule/2021-06-15-some-antics-figma.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Some Antics: Let's Build a UI in Figma with Martin Bavio" 3 | type: Live Event 4 | date: 2021-06-15 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Martin Bavio 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-07-20-some-antics-auditing.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Auditing Websites for Web Accessibility' 3 | type: Live Event 4 | date: 2021-07-20 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Anna E. Cook 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-07-27-some-antics-disabling-buttons.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Inclusively Disabling Buttons' 3 | type: Live Event 4 | date: 2021-07-27 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Sandrina Pereira 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-06-08-some-antics-github-navigation.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Some Antics: Let's Clone GitHub's Navigation Widget" 3 | type: Live Event 4 | date: 2021-06-08 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Michael Chan 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-07-12-some-antics-safari-15-features.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Accessibility with the Safari 15 Preview' 3 | type: Live Event 4 | date: 2021-07-12 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Chance Strickland 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-06-01-some-antics-postgres.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Some Antics: The Beginner's Guide to Postgres, with Sarah Beardsley" 3 | type: Live Event 4 | date: 2021-06-01 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Sarah Beardsley 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-06-22-some-antics-elementor.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Building Accessible WordPress Sites with Elementor' 3 | type: Live Event 4 | date: 2021-06-22 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Anne-Mieke Bovelett 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/_data/contributors.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs'); 2 | 3 | const data = fs.readFileSync(`${process.cwd()}/.all-contributorsrc`, 'utf-8'); 4 | const { contributors } = JSON.parse(data); 5 | contributors.sort((left, right) => left.name.localeCompare(right.name)); 6 | 7 | module.exports = contributors; 8 | -------------------------------------------------------------------------------- /src/schedule/2021-12-09-frontend-horse-migrating-to-react-18.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Frontend Horse: Migrating to React 18' 3 | type: Live Event 4 | date: 2021-12-09 17:00:00 5 | speakers: 6 | - Alex Trost 7 | - Michael Chan 8 | url: https://frontend.horse/episode/migrating-to-react-18 9 | --- 10 | -------------------------------------------------------------------------------- /src/schedule/2021-06-29-some-antics-accessibility-for-3d-in-react-three-fiber.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Accessibility for 3D in React Three Fiber' 3 | type: Live Event 4 | date: 2021-06-29 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Alex Anderson 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-05-11-some-antics-building-a-navigation-component-with-chantastic.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Building a Navigation Component with Chantastic' 3 | type: Live Event 4 | date: 2021-05-11 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Michael Chan 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | -------------------------------------------------------------------------------- /src/_includes/partials/calendar.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | -------------------------------------------------------------------------------- /src/assets/favicon/browserconfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | #000000 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | name: Netlify Rebuild 2 | on: 3 | schedule: 4 | - cron: '0 21 * * MON-FRI' 5 | jobs: 6 | build: 7 | name: Netlify Rebuild 8 | runs-on: ubuntu-latest 9 | steps: 10 | - name: Curl request 11 | run: curl -X POST -d {} https://api.netlify.com/build_hooks/601321b7879709a8b8874175 12 | -------------------------------------------------------------------------------- /src/schedule/2021-11-18-learn-with-jason-styling-with-attribute-selectors.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Learn With Jason: Styling with Attribute Selectors' 3 | type: Live Event 4 | date: 2021-11-18 17:30:00 5 | speakers: 6 | - Jason Lengstorf 7 | - Michael Chan 8 | url: https://www.learnwithjason.dev/styling-with-attribute-selectors 9 | --- 10 | -------------------------------------------------------------------------------- /src/schedule/2021-05-28-localize-datetimes-in-eleventy-with-js.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Localize datetimes in Eleventy with JS' 3 | type: Mob Job 4 | date: 2021-05-28 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | {% youtube-video "https://youtu.be/00Iu8-jAWNY" %} 10 | 11 | GitHub issue: https://github.com/LunchDevCommunity/community-calendar/issues/71 12 | -------------------------------------------------------------------------------- /src/js/localize-dates.js: -------------------------------------------------------------------------------- 1 | document.querySelectorAll('time[datetime]').forEach((dateEl) => { 2 | let date = new Date(dateEl.getAttribute('datetime')); 3 | 4 | dateEl.textContent = date.toLocaleString(undefined, { 5 | month: 'short', 6 | day: 'numeric', 7 | year: 'numeric', 8 | timeZoneName: 'short', 9 | hour: 'numeric', 10 | minute: 'numeric', 11 | }); 12 | }); 13 | -------------------------------------------------------------------------------- /src/schedule/2021-07-09-some-antics-prismic.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: An Introduction to Prismic' 3 | type: Live Event 4 | date: 2021-07-09 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Alex Trost 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | 12 | [Alex Trost](https://frontend.horse) will show us how easy it is to build Jamstack sites with Prisma as your CMS. 13 | -------------------------------------------------------------------------------- /src/utils/person.js: -------------------------------------------------------------------------------- 1 | module.exports.getAvatarUrl = function (user) { 2 | if (!user) { 3 | return '/assets/avatar-fallback.jpg'; 4 | } 5 | 6 | if (user.avatar_url) { 7 | return user?.avatar_url; 8 | } 9 | 10 | if (user?.github) { 11 | return `https://avatars.githubusercontent.com/${user.github}`; 12 | } 13 | 14 | return '/assets/avatar-fallback.jpg'; 15 | }; 16 | -------------------------------------------------------------------------------- /src/schedule/2021-03-16-fix-dst-dates-in-eleventy.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Fix DST Dates in Eleventy' 3 | type: Mob Job 4 | date: 2021-03-16 18:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Our dates at events.lunch.dev got all manner of messed up after Dayliht Savings Time. 10 | 11 | We got the crew together and fixed them. 12 | 13 | {% youtube-video 'https://youtu.be/_kQSbgzbq6I' %} 14 | -------------------------------------------------------------------------------- /src/schedule/2021-06-18-simplifying-the-data-layer-with-prisma.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Simplifying the data layer with Prisma' 3 | type: Live Event 4 | date: 2021-06-18 17:00:00 5 | speakers: 6 | - Austin Crim 7 | --- 8 | 9 | Prisma is a suite of database tools that makes things like data access, modeling, and migrations approachable. 10 | 11 | {% youtube-video 'https://youtu.be/RkZ4OAqS9UA' %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-07-09-remix-run-thru.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Remix Run-Thru #1' 3 | type: Live Event 4 | date: 2021-07-09 19:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | As a group, we’ll dive into the documentation na guides of Remix to create and deploy our first Remix site! 10 | 11 | [Remix Documentation](https://docs.remix.run/) 12 | 13 | {% youtube-video 'https://youtu.be/nR8iTDgzABg' %} 14 | -------------------------------------------------------------------------------- /src/schedule/2022-01-03-january-kickoff.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: January Kickoff 3 | type: Hangout 4 | date: 2022-01-03 18:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | A casual hangout with others on the server to discuss 2022 plans, events you'd like to see this month, and say "hi." If you're feeling shy, feel free to pop in and keep mic/camera off. We're happy to have you participate however you feel comfortable. 10 | -------------------------------------------------------------------------------- /src/schedule/2021-03-16-react-in-3d.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'React in 3D' 3 | type: Talk 4 | date: 2021-03-16 18:00:00 5 | speakers: 6 | - Alex Anderson 7 | --- 8 | 9 | Learn about how 3D Graphics works, how to make them using [Three.js](https://threejs.org/), and how [React Three Fiber](https://www.npmjs.com/package/react-three-fiber) makes the whole process easier. 10 | 11 | {% youtube-video 'https://youtu.be/Ymgu_XMH8_k' %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-11-08-space-age-real-time-networking.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Space-Age Real-Time Networking' 3 | type: Mob Job 4 | date: 2021-11-08 21:00:00 5 | speakers: 6 | - Alex Anderson 7 | --- 8 | 9 | Join us in the Discord `#event-recorded` channel as Alex walks through his spaceship game, how the real-time API works, why he made the decisions and tradeoffs that he did, and give a demonstration of why it's awesome. 10 | -------------------------------------------------------------------------------- /src/schedule/2021-03-30-some-antics-a11y-ama.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Ask Me Anything About Accessibility!' 3 | type: Episode Party 4 | date: 2021-03-30 17:00:00 5 | speakers: 6 | - Ben Myers 7 | --- 8 | 9 | {% twitch 'someanticsdev' %} 10 | 11 | You've got web accessibility questions — [Ben](https://twitter.com/BenDMyers) might have answers! Come join us on [Some Antics](https://twitch.tv/SomeAnticsDev) for an #a11y Ask Me Anything. 12 | -------------------------------------------------------------------------------- /src/schedule/2021-05-04-some-antics-interactive-games-powered-by-twitch-chat.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Interactive Games Powered by the Twitch Chat' 3 | type: Live Event 4 | date: 2021-05-04 17:00:00 5 | --- 6 | 7 | {% twitch 'someanticsdev' %} 8 | 9 | Today on [Some Antics](https://twitch.tv/SomeAnticsDev), we're doing something a little different: we're going to use web technologies to make onstream games playable within the Twitch chat! 10 | -------------------------------------------------------------------------------- /src/schedule/2021-07-06-some-antics-vite.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Vite and the Next Generation of Frontend Tooling' 3 | type: Live Event 4 | date: 2021-07-06 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Anthony Campolo 8 | --- 9 | 10 | {% twitch 'SomeAnticsDev' %} 11 | 12 | [Anthony Campolo](https://twitter.com/ajcwebdev) rejoins us to share how Vite and the next generation of frontend tooling will empower developers to build great apps quickly. 13 | -------------------------------------------------------------------------------- /src/schedule/2020-12-22-ui-reproduction-interview-challenge.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: UI Reproduction Interview Challenge 3 | date: 2020-12-22 18:00:00 4 | speakers: 5 | - Jacob Roman 6 | - Michael Chan 7 | --- 8 | 9 | Jacob Roman just finished an interview process with an interesting code challenge — a personalized movie review page! Jacob and Chantastic will reproducing this design with React, CSS, and CSS Grid! 10 | 11 | {% youtube-video 'https://www.youtube.com/watch?v=WP9aTzG8EoA&feature=emb_title' %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-06-11-react-18-twitter-space-party.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'React 18 Twitter Spaces Listen Party' 3 | type: Live Event 4 | date: 2021-06-11 17:00:00 5 | speakers: 6 | - React 7 | - Michael Chan 8 | --- 9 | 10 | The React 18 Working Group is hosting a Twitter space tomorrow. 11 | 12 | Join us as we discuss the plan for React 18, upcoming new features, and our efforts to prepare library maintainers for concurrent rendering. 13 | 14 | https://twitter.com/reactjs/status/1403060135514329092 15 | -------------------------------------------------------------------------------- /src/assets/favicon/site.webmanifest: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Lunch.dev Calendar", 3 | "short_name": "Lunch.dev Calendar", 4 | "icons": [ 5 | { 6 | "src": "/assets/favicon/android-chrome-192x192.png", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "/assets/favicon/android-chrome-512x512.png", 12 | "sizes": "512x512", 13 | "type": "image/png" 14 | } 15 | ], 16 | "theme_color": "#ffd600", 17 | "background_color": "#ffd600", 18 | "display": "standalone" 19 | } 20 | -------------------------------------------------------------------------------- /src/schedule/2020-12-21-eleventy-community-calendar.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Building a Community Calendar with Eleventy 3 | date: 2020-12-21 19:00:00 4 | speakers: 5 | - Ben Myers 6 | --- 7 | 8 | Howdy, y'all! I've been wanting to build a site that could serve as a calendar for the community, and I've got some free time. At 1 PM PST, come join me in #live-event-voice as I start from a brand new repo and spin up this site in Eleventy! 9 | 10 | {% youtube-video 'https://www.youtube.com/watch?v=mXgnSwGWtjI' %} 11 | -------------------------------------------------------------------------------- /src/schedule/2021-01-15-create-social-cards-with-open-graph-and-cloudinary.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Create Social Cards with Open Graph and Cloudinary 3 | type: Mob Job 4 | date: 2021-01-15 18:00:00 5 | --- 6 | 7 | Chantastic leads the lunch.dev crew through an exercise in implementing, and testing social cards using Open Graph tags and Cloudinary. Social cards unfurl in social media and chat apps to give your web pages a more attractive, engaging preview. 8 | 9 | {% youtube-video 'https://youtu.be/R1w3Xh0WVSo' %} 10 | -------------------------------------------------------------------------------- /src/schedule/2021-04-05-querying-a-graphql-api.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Querying a GraphQL API' 3 | type: Talk 4 | date: 2021-04-05 17:00:00 5 | speakers: 6 | - Anthony Campolo 7 | --- 8 | 9 | Anthony Campolo will demonstrate different approaches to querying a GraphQL API. Whether using Apollo Client, `graphql-requests`, or simply the `fetch` API, this talk will explore the numerous trade-offs and considerations behind how to make GraphQL queries. 10 | 11 | {% youtube-video 'https://youtu.be/AT_ofIx96Wg' %} 12 | -------------------------------------------------------------------------------- /src/utils/get-twitch-channel-embed.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Generates the markup for a responsive Twitch channel embed. 3 | * @param {string} channel Twitch channel name 4 | * @returns {string} Twitch embed markup 5 | */ 6 | module.exports = function getTwitchChannelEmbed(channel) { 7 | return `
8 | 9 | `; 12 | }; 13 | -------------------------------------------------------------------------------- /src/schedule/2021-04-13-some-antics-test-driven-development-with-adrianne-mallett.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Writing Tests First with Adrianne Mallett' 3 | type: Live Event 4 | date: 2021-04-13 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Adrianne Mallett 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | 12 | What does test-driven development mean for you and your projects? Join us on [Some Antics](https://twitch.tv/SomeAnticsDev) as [Adrianne Mallett](https://twitter.com/mennairda) walks [Ben](https://twitter.com/BenDMyers) through her testing philosophy. 13 | -------------------------------------------------------------------------------- /src/css/navbar.css: -------------------------------------------------------------------------------- 1 | #navbar { 2 | width: 100%; 3 | background-color: black; 4 | margin-bottom: 1.5em; 5 | text-align: center; 6 | } 7 | 8 | #navbar a { 9 | color: white; 10 | font-weight: 900; 11 | text-decoration: none; 12 | font-family: 'Alegreya Sans', sans-serif; 13 | } 14 | 15 | #navbar a:hover { 16 | color: gold; 17 | } 18 | 19 | #navbar a:focus { 20 | color: gold; 21 | } 22 | 23 | #navbar a:focus-visible { 24 | outline: 2px solid gold; 25 | outline-offset: 0.3em; 26 | } 27 | 28 | #navbar h1 { 29 | margin: 0; 30 | font-size: 24pt; 31 | padding: 8px 0; 32 | } 33 | -------------------------------------------------------------------------------- /src/schedule/2021-01-14-data-fetching-with-server-components.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Data Fetching With Server Components 3 | type: Episode Party 4 | date: 2021-01-14 18:00:00 5 | --- 6 | 7 | Before the holidays, the React Core [announced React Server Components](https://it.reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html). 8 | 9 | We'll watch and discuss this talk as a group. 10 | 11 | {% youtube-video 'https://youtu.be/TQQPAU21ZUw' %} 12 | 13 | ## Resources 14 | 15 | - [React Server Components Announcement Notes — chan.dev](https://chan.dev/posts/react-server-components-announcement-notes/) 16 | -------------------------------------------------------------------------------- /src/schedule/2021-02-10-using-storybook-with-redwood.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Using Storybook with Redwood 3 | type: Talk 4 | date: 2021-02-12 18:00:00 5 | speakers: 6 | - Anthony Campolo 7 | --- 8 | 9 | Redwood has recently released their [second tutorial](https://community.redwoodjs.com/t/the-prophecy-is-fulfilled-tutorial-part-2-is-coming/1657) covering topics including testing and Storybook. In this talk, Anthony Campolo (RedwoodJS Core Advocate), will demonstrate how to setup Storybook in a Redwood project and how to build a component with a Storybook workflow. 10 | 11 | {% youtube-video 'https://youtu.be/zYm1a39Lpgs' %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-03-16-some-antics-specs-tests-and-mocks.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Specs, Tests, and Mocks with Randy Brown' 3 | type: Live Event 4 | date: 2021-03-16 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Randy Brown 8 | --- 9 | 10 | So your frontend needs some data. We get it — mistakes happen! The trouble is… your tests need mock data now. 11 | 12 | Join us on [Some Antics](https://twitch.tv/SomeAnticsDev) as [Randy Brown](https://twitter.com/thatrandybrown) shares how backend principles like API specs and mocks can improve our frontend developer experience. 13 | 14 | {% youtube-video 'https://www.youtube.com/watch?v=h1f8tUbpbbA' %} 15 | -------------------------------------------------------------------------------- /src/schedule/2021-04-28-some-antics-web-components-with-andy-bell.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Some Antics: Let's Make Dang Spicy Web Components with Andy Bell!" 3 | type: Live Event 4 | date: 2021-04-28 18:30:00 5 | speakers: 6 | - Ben Myers 7 | - Andy Bell 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | 12 | Web components are a way to make reusable components from chunks of your interface — without the need for a framework like React or Vue! 13 | 14 | Join [Ben](https://twitter.com/BenDMyers) and their guest [Andy Bell](https://twitter.com/piccalilli_) on [Some Antics](https://twitch.tv/SomeAnticsDev), as they show off how to make slick web components. 15 | -------------------------------------------------------------------------------- /src/contributors.liquid: -------------------------------------------------------------------------------- 1 | --- 2 | title: Contributors 3 | layout: 'layouts/page.html' 4 | --- 5 | 6 | {% for contributor in contributors %} 7 |
8 | 9 |

10 | {{ contributor.name }} 11 |

12 | 20 |
21 | {% endfor %} -------------------------------------------------------------------------------- /src/schedule/2021-07-21-state-of-the-react-ecosystem-with-this-dot.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'State of React Ecosystem with This Dot' 3 | type: Live Event 4 | date: 2021-07-15 16:00:00 5 | speakers: 6 | - Michael Chan 7 | - Shruti Kapoor 8 | - Ian Sutherland 9 | - David Ceddia 10 | - Brandon Bayer 11 | - Keionne Derousselle 12 | --- 13 | 14 | Keep up with modern web technology advancements through these special “State of” events. This month, we’re bringing you “State of React Ecosystem”. Hear from core contributors, library authors, & more about various frameworks within the React Ecosystem! 15 | 16 | **[Register for the event](https://www.reactjsmeetup.com/#/)** 17 | -------------------------------------------------------------------------------- /src/schedule/2021-03-26-remix.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Introduction to Remix' 3 | type: Talk 4 | date: 2021-03-26 19:00:00 5 | speakers: 6 | - Michael Jackson 7 | --- 8 | 9 | For this lunch session, [Michael Jackson](https://twitter.com/mjackson) will take us on a tour of [Remix](https://remix.run), a new web framework for React from the authors of React Router. The session will be a hands-on demo, showing how Remix takes advantage of both time-honored techniques like server rendering and prefetching as well as more modern client-side state and optimistic UI updates to help you build fast, progressively-enhanced web apps. 10 | 11 | {% youtube-video 'https://youtu.be/VlKEzWpOuv0' %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-02-26-extend-your-workflow-with-e2e-testing--cypress.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Extend Your Workflow with E2E Testing & Cypress 3 | type: Talk 4 | date: 2021-02-26 18:00:00 5 | speakers: 6 | - Paul Jaffre 7 | --- 8 | 9 | Automated testing often falls under two categories: difficult and ignored. 10 | 11 | [Cypress.io](https://www.cypress.io/) has made strides to package up a polished, developer-friendly product that offers clever ease of use and ample piece of mind. 12 | 13 | In this talk, Paul Jaffre (cool dude), will demonstrate the high value proposition of Cypress.io, introducing core concepts and how get rolling quickly. 14 | 15 | {% youtube-video 'https://youtu.be/_OLslURnfj8' %} 16 | -------------------------------------------------------------------------------- /src/css/events.css: -------------------------------------------------------------------------------- 1 | .events-page .add-to-calendar { 2 | list-style: none; 3 | margin: 10px 0 15px 0; 4 | padding: 0; 5 | display: flex; 6 | } 7 | 8 | .events-page .add-to-calendar li { 9 | flex-direction: row; 10 | justify-content: space-between; 11 | margin: 0 8px; 12 | } 13 | 14 | .events-page .add-to-calendar li svg { 15 | width: 20px; 16 | fill: dimgray; 17 | } 18 | 19 | .events-page .add-to-calendar li svg:hover { 20 | fill: black; 21 | } 22 | 23 | th { 24 | background-color: black; 25 | color: white; 26 | padding: 0.5em; 27 | } 28 | 29 | td { 30 | background-color: #f0f0f0; 31 | padding: 0.5em; 32 | } 33 | 34 | tbody tr:nth-child(odd) td { 35 | background-color: white; 36 | } 37 | -------------------------------------------------------------------------------- /src/schedule/2021-05-27-nextjs-conf-multiplayer-cursors.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Let's Build It: Next.js Conf Multiplayer Cursors" 3 | type: Mob Job 4 | date: 2021-05-27 17:00:00 5 | speakers: 6 | - Alex Anderson 7 | --- 8 | 9 | Check out this [cool landing page for the Next.js Conf](https://nextjs.org/conf)! 10 | 11 | Lets try to recreate it. We'll do them one better too - we'll use Cloudflare Workers and Durable Objects! Can anyone say "Living on the edge?" 😏 12 | 13 | We'll start with [this CodePen](https://codepen.io/alexanderson1993/pen/xxqRJdN?editors=1111) as the base, so we don't have to implement the styling or mouse move logic as part of this. 14 | 15 | {% youtube-video "https://youtu.be/ATe5hjXX1gI" %} 16 | -------------------------------------------------------------------------------- /src/_includes/partials/favicon.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /src/schedule/2021-06-16-feature-content-by-date-in-eleventy-using-custom-filters.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Feature content by date in Eleventy using custom filters' 3 | type: Mob Job 4 | date: 2021-06-16 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | It's difficult find events by date on [lunch.dev](https://events.lunch.dev). Folks most often go there to find out [what's next or what's happening this week](https://github.com/LunchDevCommunity/community-calendar/issues/5). Let's add 'Next' and 'Later this week' sections to the home page using [Eleventy's custom filtering and sorting](https://www.11ty.dev/docs/collections/#advanced-custom-filtering-and-sorting) APIs. 10 | 11 | {% youtube-video "https://youtu.be/Cu-4aPE_WrI" %} 12 | -------------------------------------------------------------------------------- /src/schedule/2021-10-15-october-lightning-talks.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'October Lightning Talks' 3 | type: Live Event 4 | date: 2021-10-15 17:00:00 5 | speakers: 6 | - Dan Goodwin 7 | - Randy Brown 8 | - Matt Sutkowski 9 | - Martin Bavio 10 | - Adrianne Mallett 11 | --- 12 | 13 | It's conference season, which means it's time for the autumn session of lightning talks. 14 | 15 | Our speaker line up (so far), in no particular order: 16 | 17 | - “Talking to Dinosaurs (Decoupled React and PHP)” by Dan Goodwin 18 | - "MAPS for Frontend Architecture" by Randy Brown and Matt Sutkowski 19 | - "You are a developer. Now design!" by Martin Bavio 20 | - "Stryker for JavaScript: Are your unit tests good enough?" by Adrianne Mallett 21 | - TBD 22 | -------------------------------------------------------------------------------- /src/schedule/2021-07-08-learning-and-teaching-react-with-egghead.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Learning and Teaching React with Egghead' 3 | type: Live Event 4 | date: 2021-07-08 17:00:00 5 | speakers: 6 | - Michael Chan 7 | - Kent C. Dodds 8 | - Shaundai Person 9 | - Ben Ilegbodu 10 | --- 11 | 12 | In this Twitter Spaces event, we'll answer questions about learning and teaching React. 13 | 14 | **[Register for a reminder here](https://mobile.twitter.com/i/spaces/1mrGmwwnnEvxy)** 15 | 16 | Event features: 17 | 18 | - [Michael Chan](https://mobile.twitter.com/chantastic) 19 | - [Kent C. Dodds](https://mobile.twitter.com/kentcdodds) 20 | - [Shaundai Person](https://mobile.twitter.com/shaundai) 21 | - [Ben Ilegbodu](https://mobile.twitter.com/benmvp) 22 | -------------------------------------------------------------------------------- /src/schedule/2021-05-18-some-antics-getting-started-automated-a11y-testing.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Getting Started with Automated Accessibility Testing, with Lucia Cerchie' 3 | type: Live Event 4 | date: 2021-05-18 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Lucia Cerchie 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | 12 | How can automated tools improve our accessibility testing process? Join us on [Some Antics](https://twitch.tv/SomeAnticsDev) as [Lucia Cerchie](https://twitter.com/CerchieLucia), a software engineer at StepZen, shows us how tools such as [Lighthouse](https://developers.google.com/web/tools/lighthouse) and [Axe](https://www.deque.com/axe/devtools/) can make our jobs easier, and how we can start using these tools today. 13 | -------------------------------------------------------------------------------- /src/schedule/2021-08-02-mastermind-monday.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Mastermind Monday — August' 3 | type: Live Event 4 | date: 2021-08-02 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Welcome to the first server mastermind event! 10 | 11 | These sessions are a time to share what our monthly goals, open up to suggestion, and encourage each other in our efforts to achieve them. We have so many creators in the server that it'll be fun to see where everyone is headed and how they plan to get there. 12 | 13 | Participation rules: 14 | 15 | - Participation is welcome but not required — it's totally OK to lurk 16 | - Be respectful of other's time. Keep reports and suggestions brief and focused 17 | - We'll be learning as we go. So, uggestions welcome! 18 | -------------------------------------------------------------------------------- /src/schedule/2021-11-10-upc-lookup.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Build a UPC Lookup Service with Astro, Cloudflare Workers, and KV' 3 | type: Mob Job 4 | date: 2021-11-10 19:00:00 5 | speakers: 6 | - Justin Noel 7 | --- 8 | 9 | Justin Noel is teaching us how to build a UPC lookup service with Astro, Cloudflare Workers, Pages, and KV! 10 | 11 | Channel: 12 | 13 | Join us to learn how to: 14 | 15 | - Use Cloudflare Pages to host a simple static HTML page as a "site" 16 | - Use the Astro Static Site Generator to add vanilla JavaScript and more pages to the site 17 | - Build a really simple "database" to hold fake product info 18 | - Build an API using Cloudflare Workers to do database lookups on UPC bar codes and return product information 19 | -------------------------------------------------------------------------------- /src/schedule/2021-03-02-thinking-in-react-with-keith-elliott.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Thinking in React with Keith Elliott 3 | type: Talk 4 | date: 2021-03-02 16:00:00 5 | speakers: 6 | - Keith Elliott 7 | --- 8 | 9 | Keith Elliott talks through Thinking in React. He's creating an app, and capturing the journey in public (and he's just beginning the journey). 10 | 11 | He'll walk us through basic React concepts and habits. The themes are centered around the [Thinking in React](https://reactjs.org/docs/thinking-in-react.html) article on reactjs.org. 12 | 13 | If you would like a preview in advance, you can check out [FlipAgain Episode 1](https://youtu.be/Q4BnWK05H5w) and [FlipAgain Episode 2](https://youtu.be/KzTqIMVL1RA). 14 | 15 | {% youtube-video 'https://youtu.be/I5vC3Zf8Z5k' %} 16 | -------------------------------------------------------------------------------- /src/schedule/2021-04-20-some-antics-design-systems-with-ashlae-nelms.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Accessible Design Systems with Ashlae Nelms' 3 | type: Episode Party 4 | date: 2021-04-20 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Ashlae Nelms 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | 12 | Design systems are a powerful tool for making sure an organization leverages accessible practices consistently and reliably. Accessibility can be baked into all you do, from the first principles of your design all the way out to whole experiences. 13 | 14 | Join [Ben](https://twitter.com/BenDMyers) and their guest [Ashlae Nelms](https://twitter.com/AshlaeAnnNelms) on [Some Antics](https://twitch.tv/SomeAnticsDev), as 15 | they explore how to build accessible design systems from the start. 16 | -------------------------------------------------------------------------------- /src/schedule/2021-03-03-singlethreaded-faduma-mohammed-on-code-reviews--compliments.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'single-threaded: Faduma Mohammed on Code Reviews & Compliments' 3 | type: Episode Party 4 | date: 2021-03-03 18:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Faduma Mohammed 8 | --- 9 | 10 | Faduma Mohammed ([@FadumaFaralacag](https://twitter.com/FadumaFaralacag)) joins the podcast to talk about code reviews, pull request pairing, and why Github is a volcano of miscommunication. 11 | 12 | [Transcript](https://dev.to/gurlcode/single-threaded-podcast-faduma-mohammed-on-code-reviews-compliments-562f) 13 | 14 | 15 | -------------------------------------------------------------------------------- /src/schedule/2021-09-02-typescript-in-50-lessons-chapter-2b.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'TypeScript in 50 Lessons — Chapter 2b (11, 12, 13, 14)' 3 | type: Club 4 | date: 2021-09-02 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Join us this week for lessons 11, 12, 13, and 14 of TypeScript in 50 Lessons. Lessons include: 10 | 11 | - Lesson 11: Typing Objects 12 | - Lesson 12: Object Type Tool Belt 13 | - Lesson 13: Typing Classes 14 | - Lesson 14: Interfaces 15 | 16 | Come with questions concerns, and curiosity! 17 | 18 | This is a short-term community group for owners of the book TypeScript in 50 Lessons. The only requirement is that you own the book. 19 | 20 | - [Amazaon — Kindle-only](https://amzn.to/3lr3ahA) (affiliate link) 21 | - [Smashing Magazine — all formats](https://typescript-book.com) 22 | -------------------------------------------------------------------------------- /src/schedule/2021-02-08-add-calendar-links-to-11ty-with-computed-data.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Add Calendar Links to 11ty with Computed Data 3 | type: Mob Job 4 | date: 2021-02-08 18:00:00 5 | description: Come and learn with us as we walk through Jacob Roman's learning experience of llty and adding in a add-to-calendar module. 6 | --- 7 | 8 | During this session we will be going over the steps to add a calendar invite link to our 11ty site. 9 | 10 | Some things we will be covering: 11 | 12 | - Computed data 13 | - Partials / Templates 14 | - Best approaches 15 | 16 | **Now on YouTube** 17 | 18 | {% youtube-video 'https://youtu.be/dKYtysS2bKk' %} 19 | 20 | ## Resources 21 | 22 | - [11ty Computed Data](https://www.11ty.dev/docs/data-computed/) 23 | - [calendar-link](https://www.npmjs.com/package/calendar-link) 24 | -------------------------------------------------------------------------------- /src/schedule/2021-02-25-the-power-of-mental-models-with-maggie-appleton.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'The Power of Mental Models with Maggie Appleton' 3 | type: Episode Party 4 | date: 2021-02-25 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Maggie Appleton's [React Podcast](https://reactpodcast.com) episode on mental models. This episode aired March 19th, 2020 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | We learn from Maggie Appleton about mental models, conceptual metaphor theory, culture, creative thinking, drawing a box, and how it all comes together in her incredible Egghead course artwork. 12 | 13 | 14 | -------------------------------------------------------------------------------- /src/_includes/partials/calendarLinks.html: -------------------------------------------------------------------------------- 1 |
2 | Add this event to your calendar: 3 | 23 |
24 | -------------------------------------------------------------------------------- /src/schedule/2021-04-06-some-antics-personalizing-with-joe-lamyman.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Personalizing User Interfaces for Accessibility with Joe Lamyman' 3 | type: Live Event 4 | date: 2021-04-06 18:00:00 5 | speakers: 6 | - Ben Myers 7 | - Joe Lamyman 8 | --- 9 | 10 | {% twitch 'someanticsdev' %} 11 | 12 | Join us on [Some Antics](https://twitch.tv/SomeAnticsDev) this Tuesday as our guest [Joe Lamyman](https://twitter.com/JoeLamyman) shows us how we can use personalization to empower accessible sites and meet each individual's own needs! We'll explore personalization, e-commerce, and what these things have to with toilet paper. 13 | 14 | Joe is a web developer/designer/person currently working for SkillsForge in beautiful York, UK. His work focuses around trying to make experiences personalized towards the needs and goals of individuals. 15 | -------------------------------------------------------------------------------- /src/schedule/2021-04-21-singlethreaded-s1-finale.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Single-Threaded Season 1 Finale: Duretti Hirpa on Making Good Trouble' 3 | type: Episode Party 4 | date: 2021-04-21 17:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Duretti Hirpa 8 | --- 9 | 10 | Each season, [single-threaded](https://anchor.fm/single-threaded/) tackles a new topic in software engineering. This first season, we're exploring feelings. Why do we like some technologies but dislike others? How do our emotions come into play with our career choices? These are some of the questions we'll be answering this season. Episodes are a mix of guest interviews and solo musings. 11 | 12 | Join us on Wednesday, April 21 for a group listen of the _single-threaded_ Season 1 finale! We'll be listening together in the `episode-party` voice channel, and sharing our thoughts in the `#single-threaded` channel. 13 | -------------------------------------------------------------------------------- /src/utils/get-youtube-video-embed.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Generates the markup for a responsive YouTube video embed. 3 | * @param {string} url URL of the YouTube upload 4 | * @returns {string} YouTube embed markup 5 | */ 6 | module.exports = function getYouTubeVideoEmbed(url) { 7 | return `
8 | 9 |
`; 10 | }; 11 | 12 | /** 13 | * Extracts a YouTube video's ID from its upload URL. 14 | * @param {string} url URL of the YouTube upload 15 | * @returns {string} the YouTube video's ID 16 | */ 17 | function getVideoIdFromYouTubeURL(url) { 18 | let regExp = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|&v=)([^#&?]*).*/; 19 | let match = url.match(regExp); 20 | 21 | return match && match[2].length === 11 ? match[2] : null; 22 | } 23 | -------------------------------------------------------------------------------- /src/schedule/2021-03-04-react-spring-with-paul-henschel.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'React Spring with Paul Henschel' 3 | type: Episode Party 4 | date: 2021-03-04 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Paul Henschel's [React Podcast](https://reactpodcast.com) episode on React Spring and lasting beauty on the web. This episode aired July 25th, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | This week, on React Podcast, We sit with Paul Henschel and talk animation. 12 | 13 | Paul is the creator of React-spring a library for animating UI based on spring physics. 14 | 15 | We talk about the library's origin, its future, and how to create lasting beauty on the web. 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/schedule/2021-02-23-some-antics-accessible-svgs.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Building Accessible SVG Icons in React with Chantastic' 3 | type: Live Event 4 | date: 2021-02-23 18:00:00 5 | speakers: 6 | - Ben Myers 7 | - Michael Chan 8 | --- 9 | 10 | {% youtube-video 'https://youtu.be/t0vU8n1AQXU' %} 11 | 12 | **You know what they say… an SVG is worth a thousand words.** 13 | 14 | A well-placed icon can communicate a lot in very little space. Ensuring that communication is accessible can be a challenge, however, especially as you scale up to a whole icon library. 15 | 16 | Join us on [Some Antics](https://twitch.tv/someanticsdev), **Tuesday, February 16 at 10am PST**, as our guest, our very own [Michael "Chantastic" Chan](https://twitter.com/chantastic) walks us through his journey through building an accessible, reusable SVG icon library in React. It's going to be a great time. 17 | -------------------------------------------------------------------------------- /src/schedule/2021-05-14-create-posts-in-eleventy-using-collections.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Create posts in Eleventy using collections' 3 | type: Mob Job 4 | date: 2021-05-14 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Lunch devs create so much great content that it can be hard to find. Folks who want to watch previous events don't know when videos are released. Let's add a place for linkable summary posts with a recap of each week's content — a "lunch digest" if you will! 10 | 11 | [lunch.dev](https://events.lunch.dev) uses [Eleventy](https://events.lunch.dev) to build server-side generate the site on [Netlify](https://www.netlify.com) and using [GitHub Actions](https://github.com/features/actions). 12 | 13 | To accomplish this mob job, we'll use [Eleventy Collections](https://www.11ty.dev/docs/collections/] to add a "/posts" route. 14 | 15 | {% youtube-video "https://youtu.be/cxG6mB0Uw5M" %} 16 | -------------------------------------------------------------------------------- /src/_includes/partials/microsoftoffice.svg: -------------------------------------------------------------------------------- 1 | 2 | Microsoft Office icon 3 | 4 | -------------------------------------------------------------------------------- /src/schedule/2020-12-14-eleventy-at-11.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Eleventy at 11 3 | date: 2020-12-14 19:00:00 4 | speakers: 5 | - Robb Schuneman 6 | - Michael Chan 7 | --- 8 | 9 | Robb Schuneman and Chantastic are pairing on an Eleventy site deployed to Netlify. 10 | Robb is working on a new personal site. After some discussion in #accessibility, he decided yo move forward with [Eleventy](https://www.11ty.dev/) and [Netlify](https://www.netlify.com/). 11 | He graciously agreed to stream the learning process for the benefit of others here. 12 | It'll be fun! And you don't need any previous knowledge to learn with us. 13 | 14 | Check out [Robb's repo](https://github.com/chalkeater/robb-shoes)! 15 | 16 | {% youtube-video 'https://youtu.be/zOM4RvrHUe8' %} 17 | 18 | ## Shared Links 19 | 20 | - [Eleventy docs](https://11ty.dev/docs/) 21 | - [The `eleventy-base-blog` starter](https://github.com/11ty/eleventy-base-blog) 22 | -------------------------------------------------------------------------------- /src/css/reset.css: -------------------------------------------------------------------------------- 1 | *, 2 | *::before, 3 | *::after { 4 | box-sizing: border-box; 5 | } 6 | body, 7 | h1, 8 | h2, 9 | h3, 10 | h4, 11 | p, 12 | figure, 13 | blockquote, 14 | dl, 15 | dd { 16 | margin: 0; 17 | } 18 | ul[role='list'], 19 | ol[role='list'] { 20 | list-style: none; 21 | } 22 | html { 23 | scroll-behavior: smooth; 24 | } 25 | body { 26 | min-height: 100vh; 27 | text-rendering: optimizeSpeed; 28 | line-height: 1.5; 29 | } 30 | a:not([class]) { 31 | text-decoration-skip-ink: auto; 32 | } 33 | img, 34 | picture { 35 | max-width: 100%; 36 | display: block; 37 | } 38 | input, 39 | button, 40 | textarea, 41 | select { 42 | font: inherit; 43 | } 44 | @media (prefers-reduced-motion: reduce) { 45 | *, 46 | *::before, 47 | *::after { 48 | animation-duration: 0.01ms !important; 49 | animation-iteration-count: 1 !important; 50 | transition-duration: 0.01ms !important; 51 | scroll-behavior: auto !important; 52 | } 53 | } 54 | -------------------------------------------------------------------------------- /src/schedule/2020-12-28-style-community-calendar.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Style the Lunch.dev Community Calendar 3 | date: 2020-12-28 19:00:00 4 | --- 5 | 6 | Join us as we add CSS to our [Eleventy](https://11ty.dev)-based [community calendar](https://github.com/LunchDevCommunity/community-calendar) project. 7 | 8 | Check out [our pull request](https://github.com/LunchDevCommunity/community-calendar/pull/10)! 9 | 10 | {% youtube-video 'https://www.youtube.com/watch?v=M4moKmALiMQ&feature=emb_title' %} 11 | 12 | ## Shared Links 13 | 14 | - [Eleventy's docs for `addPassthroughCopy`](https://www.11ty.dev/docs/copy/) 15 | - [CSS Tricks on system font stacks](https://css-tricks.com/snippets/css/system-font-stack/) 16 | - [Michael Knepprath's homepage](https://mknepprath.com/) 17 | - [Josh W. Comeau's full-bleed tutorial](https://www.joshwcomeau.com/css/full-bleed/) 18 | - [Andy Bell's modern CSS reset](https://piccalil.li/blog/a-modern-css-reset/) 19 | -------------------------------------------------------------------------------- /src/schedule/2021-03-23-some-antics-accessible-routing-in-redwoodjs.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Accessible Routing in RedwoodJS' 3 | type: Live Event 4 | date: 2021-03-23 17:00:00 5 | speakers: 6 | - Ben Myers 7 | - Anthony Campolo 8 | - Dom Saadi 9 | --- 10 | 11 | Routing in single-page applications can get _tricky_. You have to manage the user's focus, and you have to announce the new page to assistive technology users. There's so much room here for the tools and frameworks to help us get things right. 12 | 13 | Join us for [Some Antics](https://twitch.tv/SomeAnticsDev) as [Anthony Campolo](https://twitter.com/ajcwebdev) and [Dom Saadi]() from the [RedwoodJS](https://redwoodjs.com) Core Team walk [Ben](https://twitter.com/BenDMyers) through Redwood's components for accessible routing, as well as the principles that can empower your framework of choice to route accessibly. 14 | 15 | {% youtube-video 'https://www.youtube.com/watch?v=LSuDHfAsBCE' %} 16 | -------------------------------------------------------------------------------- /src/schedule/2021-05-21-attribute-speakers-using-githubs-avatar-api.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Attribute Speakers using GitHub Avatars API' 3 | type: Mob Job 4 | date: 2021-05-21 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | It's impossible to know [who's leading which event](https://github.com/LunchDevCommunity/community-calendar/issues/16) from the homepage. Event leader images make an event page more engaging and help new speaker show their face online. Let's add event leader images to event pages and cards using [GitHub Avatars](https://stackoverflow.com/questions/22932422/get-github-avatar-from-email-or-name) API. 10 | 11 | Here are some stretch goals: 12 | 13 | - Add avatar collections to a card for multi-speaker events 14 | - Add covered technology (may require adding images for technologies we cover) 15 | - Add an event-leader collection page to showcase events by that leader/speaker 16 | 17 | {% youtube-video "https://youtu.be/uWMSLaOywK4" %} 18 | -------------------------------------------------------------------------------- /src/schedule/2021-04-14-singlethreaded-jeff-lembeck-hero-culture.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Single-Threaded: Jeff Lembeck on Hero Culture' 3 | type: Episode Party 4 | date: 2021-04-14 17:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Jeff Lembeck 8 | --- 9 | 10 | Each season, [single-threaded](https://anchor.fm/single-threaded/) tackles a new topic in software engineering. This first season, we're exploring feelings. Why do we like some technologies but dislike others? How do our emotions come into play with our career choices? These are some of the questions we'll be answering this season. Episodes are a mix of guest interviews and solo musings. 11 | 12 | Join us on Wednesday, April 14 for a group listen of _single-threaded_. This week, [Jenn](https://twitter.com/gurlcode) and guest [Jeff Lembeck](https://twitter.com/jefflembeck) will discuss hero wrokship. We'll be listening together in the `live-event-voice` channel, and sharing our thoughts in the `#single-threaded` channel. 13 | -------------------------------------------------------------------------------- /src/schedule/2021-01-29-eleventy-contributors-page.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Create a Contributors Page in Eleventy 3 | type: Mob Job 4 | date: 2021-01-29 18:00:00 5 | --- 6 | 7 | Recently, we've begun recognizing contributions to this community calendar with the [`all-contributors`](https://allcontributors.org/) bot! However, we wanted to take it one step further, and recognize those contributors on this site, on a [`/contributors`](https://events.lunch.dev/contributors/) page. We could do it by hand… but where's the fun in that? 8 | 9 | Join us, as we explore Eleventy's [global data](https://www.11ty.dev/docs/data-global/) system to create a `/contributors` page that automatically updates any time we recognize a contributor! 10 | 11 | Check out [Ben's pull request](https://github.com/LunchDevCommunity/community-calendar/pull/68) and [the deploy preview](https://deploy-preview-68--lunchdev-events.netlify.app/contributors/). 12 | 13 | {% youtube-video 'https://youtu.be/BBXxLK-EOB4' %} 14 | -------------------------------------------------------------------------------- /src/schedule/2021-02-24-singlethreaded-crystal-martin-on-the-value-of-i-dont-know.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: "single-threaded: Crystal Martin on the Value of 'I Don't Know'" 3 | type: Episode Party 4 | date: 2021-02-24 18:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Crystal Martin 8 | --- 9 | 10 | Crystal Martin ([@codermeow](https://twitter.com/codermeow)) joins Jenn ([@gurlcode](https://twitter.com/gurlcode)) to explore why developers hesitate to ask for help, how to handle our mistakes, and the value of saying "I don't know". 11 | 12 | Show notes: 13 | 14 | - [Follow Crystal on Twitter](https://twitter.com/codermeow) 15 | - [Her personal website](https://www.crystalmartin.co/) 16 | - [Crystal's talk at JSConf Hawaii 2019: JavaScript is asynchro-WHAT!?](https://www.youtube.com/watch?v=el9fhSbby5E) 17 | 18 | 19 | -------------------------------------------------------------------------------- /src/schedule/2021-04-09-taylor-swift-escape-room.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Taylor Swift Digital Escape Room' 3 | type: Live Event 4 | date: 2021-04-09 12:13:00 5 | speakers: 6 | - Adrianne Mallett 7 | --- 8 | 9 | **Length:** 13 minutes to trickle in + 10 min rule explanation + 60 minute breakout timer 10 | 11 | **When:** Friday April 9 at 6:13pm MDT (7:13pm CST) 12 | 13 | **What:** Adrianne will be online on the hour, but start reading the rules 13 minutes after the hour. Work in a team in the Discord `#live-event` channel to solve digital puzzles. General puzzle solving prowess and Taylor Swift acumen will both help the team! If you like one but not the other, you’ll probably still have fun. 14 | 15 | Questions ahead of time? Reach out to [Adrianne through Twitter](https://twitter.com/mennairda). 16 | 17 | ![A Sharpie next to a Post-It note which reads, "Friday April 9. Taylor Swift Digital Escape Room. 6:13 MDT = 7:13 CST."](https://cdn.discordapp.com/attachments/105756917887950848/825401213238378516/image0.jpg) 18 | -------------------------------------------------------------------------------- /src/schedule/2021-01-21-get-access-with-aaron-cannon.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Get Access with Aaron Cannon 3 | type: Episode Party 4 | date: 2021-01-21 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Aaron Cannon's [React Podcast](https://reactpodcast.com) episode on accessibility. 8 | This episode aired July 11th, 2019 but remains relevant to React developers today. 9 | 10 | ## Episode Summary 11 | 12 | This week, we talk accessibility pitfalls with Aaron Canon. 13 | 14 | Aaron is the co-founder and chief accessibility engineer at Accessible360 — where he uses his experience as a blind developer to improve real-world accessibility for all citizens of the web. 15 | 16 | He shares his first-hand experience on which practices work, which ones are bogus, where to focus our accessibility efforts, and which libraries provide the best starting point. 17 | 18 | I learned a ton. You will too. 19 | 20 | 21 | -------------------------------------------------------------------------------- /src/_includes/partials/microsoftoutlook.svg: -------------------------------------------------------------------------------- 1 | 2 | Microsoft Outlook icon 3 | 4 | 5 | -------------------------------------------------------------------------------- /src/schedule/2021-01-26-some-antics-redwoodjs-tutorials.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Some Antics: Putting RedwoodJS Docs to the Test with Anthony Campolo' 3 | type: Live Event 4 | date: 2021-01-26 18:00:00 5 | speakers: 6 | - Ben Myers 7 | - Anthony Campolo 8 | --- 9 | 10 | {% youtube-video 'https://youtu.be/ois3P63Yiwc' %} 11 | 12 | Web development tutorials often leave out accessibility best practices or even recommend inaccessible antipatterns. They have headings that are out of order, images without alt text, and more. **Join [Ben Myers](https://benmyers.dev) and his guest, our own [Anthony Campolo](https://twitter.com/ajcwebdev), as they dive into the [RedwoodJS tutorials](https://redwoodjs.com/tutorial/welcome-to-redwood) and figure out how they could better encourage accessible development from the start!** 13 | 14 | [Some Antics](https://twitch.tv/SomeAnticsDev) is Ben's new, weekly Twitch stream, focusing on web accessibility, semantic markup, progressive enhancement, and other adventures in web development. You can expect rad guests and bad puns, **Tuesdays at 10am PST.** 15 | -------------------------------------------------------------------------------- /src/schedule/2021-04-08-mentorship-and-codingcoachio-with-emma-bostian.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Mentorship and CodingCoach.io with Emma Bostian 3 | type: Episode Party 4 | date: 2021-04-08 17:00:00 5 | --- 6 | 7 | Live listen and discussion of Emma Bostian's [React Podcast](https://reactpodcast.com) episode on mentorship. This episode aired August 1, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | We sit down with venerable [Emma Bostian](https://compiled.blog/) to talk mentorship. She tells us all about different types of mentorship you can find, at what phases in your career each type is most valuable, and how to get a "yes" from someone you'd like to mentor you. 12 | 13 | We also discuss her new mentoring platform [CodingCoach.io](https://codingcoach.io) and how it's helping connect developers based on technology and field. 14 | 15 | Buckle in and get ready to get help. 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/schedule/2021-02-18-concurrent-mode-with-andrew-clark.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Concurrent Mode with Andrew Clark 3 | type: Episode Party 4 | date: 2021-02-18 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Andrew Clark's [React Podcast](https://reactpodcast.com) episode on Concurrent Mode. This episode aired August 15, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | Today we kick off our first of 6 React Conf interviews. 12 | 13 | We start with [Andrew Clark](https://twitter.com/acdlite) to learn what this React Conf 2019 means for us — our libraries and apps. He's a core team member who cut his React teeth on the Fiber rewrite and he's been deep in Concurrent React for 3 years. 14 | 15 | We chat about future features, prerelease channels, and how Suspense is preparing the way for others to bring cooperative concurrency to their libraries, applications, and frameworks. 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/schedule/2021-01-20-add-youtube-and-twitter-shortcodes-to-eleventy.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Add YouTube and Twitter Shortcodes to Eleventy 3 | type: Mob Job 4 | date: 2021-01-20 18:00:00 5 | --- 6 | 7 | [chantastic](https://twitter.com/home) and the Lunch Dev crew add YouTube and Twitter shortcodes to [events.lunch.dev](https://events.lunch.dev). 8 | 9 | The goal: instead of copying-pasting large embed codes into markdown files, new posts can use shortcodes like `youtube` and `twitter` with a content url to add rich, embedded content. 10 | 11 | {% youtube-video 'https://youtu.be/FbBq_wcmL6o' %} 12 | 13 | [Check out our pull request!](https://github.com/LunchDevCommunity/community-calendar/pull/39) 14 | 15 | ## References 16 | 17 | - [Shortcodes — Eleventy Documentation](https://www.11ty.dev/docs/shortcodes/) 18 | - [Convert a youtube video url to embed code — stackoverflow](https://stackoverflow.com/a/21607897) 19 | - [Convert Tweet URLs using oEmbed](https://developer.twitter.com/en/docs/twitter-for-websites/embedded-tweets/overview) 20 | - [node-fetch](https://github.com/node-fetch/node-fetch) 21 | -------------------------------------------------------------------------------- /src/schedule/2021-02-17-singlethreaded-erin-fox-on-interviewing.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Single-Threaded: Erin Fox on Interviewing' 3 | type: Episode Party 4 | date: 2021-02-17 18:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Erin Fox 8 | --- 9 | 10 | Erin Fox ([@erinfoox](https://twitter.com/erinfoox)) joins Jenn ([@gurlcode](https://twitter.com/gurlcode)) to talk about one of the most stressful parts of being a software developer: interviews. We talk about why interviewing in tech is nerve-racking, how to handle rejections and why, like dating, you should never commit too early. 11 | 12 | Show notes: 13 | 14 | - [Follow Erin on Twitter](https://twitter.com/erinfoox) 15 | - [Questions Erin asks a company when interviewing](https://twitter.com/erinfoox/status/1276647114009763840) 16 | - [Erin's “interviewing red flags” article](https://medium.com/@erinfoox/you-have-a-typo-in-one-of-your-github-repos-interview-red-flags-b4853671b156) 17 | 18 | 19 | -------------------------------------------------------------------------------- /src/_includes/layouts/page.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {% include partials/favicon.html %} 7 | 8 | 9 | 10 | 11 | 12 | 16 | {{ title }} | Lunch.dev Community Calendar 17 | {% include partials/analytics.html %} 18 | 19 | 20 | {% include partials/header.html %} 21 |
22 |
23 |

{{ title }}

24 | {{ content }} 25 |
26 |
27 | {% include partials/footer.html %} 28 | 29 | 30 | -------------------------------------------------------------------------------- /src/_includes/layouts/post.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {% include partials/favicon.html %} 7 | 8 | 9 | 10 | 11 | 15 | {{ title }} | Lunch.dev Community Calendar 16 | {% include partials/analytics.html %} 17 | 18 | 19 | {% include partials/header.html %} 20 |
21 |
22 |

{{ title }}

23 | {% if authors %} {{ authors | join: ', ' }} · {% endif %} {{ date | asDateTime }} 24 | {{ content | safe }} 25 |
26 |
27 | 28 | 29 | -------------------------------------------------------------------------------- /src/schedule/2021-03-31-singlethreaded-carolyn-stransky-crying-at-work.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Single-Threaded: Carolyn Stransky on Crying at Work' 3 | type: Episode Party 4 | date: 2021-03-31 17:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Carolyn Stransky 8 | --- 9 | 10 | Each season, [single-threaded](https://anchor.fm/single-threaded/) tackles a new topic in software engineering. This first season, we're exploring feelings. Why do we like some technologies but dislike others? How do our emotions come into play with our career choices? These are some of the questions we'll be answering this season. Episodes are a mix of guest interviews and solo musings. 11 | 12 | Join us on Wednesday, March 31 for a group listen of _single-threaded_. This week, [Jenn](https://twitter.com/gurlcode) and guest [Carolyn Stransky](https://twitter.com/carolstran) will discuss crying at work. We'll be listening together in the `live-event-voice` channel, and sharing our thoughts in the `#single-threaded` channel. 13 | 14 | 15 | -------------------------------------------------------------------------------- /src/schedule/2021-02-04-jamison-dance-on-soft-skills-and-creating-react-rally.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Jamison Dance on Soft Skills and Creating React Rally 3 | type: Episode Party 4 | date: 2021-02-04T18:00:00 5 | --- 6 | 7 | Live listen and discussion of Jamison Dance's [React Podcast](https://reactpodcast.com) episode on soft skills and React Rally. This episode aired August 15, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | This week we talk with [Jamison Dance](https://jamison.dance/) about the parts of programming that are distinctly non-technical. 12 | 13 | We talk about the perfect TLD, working with a team, finding psychological safety, the organization of [React Rally](https://reactrally.com/), and how to recycle batteries. 14 | 15 | Jamison is co-host of the podcast _Soft Skills Engineering_, where he and Dave Smith answer non-technical questions for technical folks. It's a great show that I highly recommend. Check it out at [softskills.audio](https://softskills.audio/). 16 | 17 | 18 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "lunchdev-community-calendar", 3 | "version": "1.0.0", 4 | "main": ".eleventy.js", 5 | "author": "Ben Myers ", 6 | "license": "MIT", 7 | "scripts": { 8 | "build": "cross-env NODE_ENV=production eleventy", 9 | "dev": "cross-env NODE_ENV=development eleventy --serve", 10 | "format": "prettier --write \"src/**/*.md\"", 11 | "gen": "node ./cli", 12 | "recognize": "all-contributors add" 13 | }, 14 | "dependencies": { 15 | "@11ty/eleventy": "^0.11.1", 16 | "@11ty/eleventy-cache-assets": "^2.3.0", 17 | "calendar-link": "^2.0.8", 18 | "cross-env": "^7.0.3", 19 | "date-fns": "^2.16.1", 20 | "generate-comparators": "^1.0.3", 21 | "markdown-it": "^12.0.4", 22 | "markdown-it-emoji": "^2.0.0" 23 | }, 24 | "devDependencies": { 25 | "@sherby/eleventy-plugin-files-minifier": "^1.1.1", 26 | "all-contributors-cli": "^6.19.0", 27 | "chalk": "^4.1.0", 28 | "commander": "^6.2.1", 29 | "husky": "^4.3.6", 30 | "inquirer": "^7.3.3", 31 | "node-emoji": "^1.10.0", 32 | "prettier": "^2.2.1", 33 | "pretty-quick": "^3.1.0" 34 | }, 35 | "husky": { 36 | "hooks": { 37 | "pre-commit": "pretty-quick --staged" 38 | } 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/schedule/2021-02-11-build-dumb-shit-with-sara-vieira.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Build Dumb Shit with Sara Vieira 3 | type: Episode Party 4 | date: 2021-02-11 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Sara Vieira's [React Podcast](https://reactpodcast.com) episode on mental health and developer advocacy. This episode aired October 31, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | [Sara](https://iamsaravieira.com/) is a developer on the beloved [CodeSandbox](https://codesandbox.io/) app. She's worked for years as a developer advocate, giving brilliant talks across the world, and building some of the wildest sites on the web. 12 | 13 | Chantastic asks her about succeeding against mental illness, how she achieved meme status, why we should "build dumb shit," and what the heck a developer advocate does. 14 | 15 | They discuss corporate "change the world" bullshit, casual racism, why you should teach what you know, and the shockingly unglamorous lifestyle of a conference speaker. 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/css/footer.css: -------------------------------------------------------------------------------- 1 | footer { 2 | display: flex; 3 | align-items: center; 4 | justify-content: space-between; 5 | margin: 16px; 6 | } 7 | 8 | .footer-links { 9 | display: flex; 10 | align-items: center; 11 | } 12 | 13 | .footer-links a { 14 | color: black; 15 | text-decoration: none; 16 | border-bottom: 2px solid transparent; 17 | } 18 | .footer-links a:hover { 19 | border-bottom: 2px solid black; 20 | } 21 | 22 | .footer-divider { 23 | margin: 0 4px; 24 | } 25 | 26 | .footer-social { 27 | display: flex; 28 | align-items: center; 29 | justify-content: space-evenly; 30 | min-width: 180px; 31 | } 32 | .footer-social a { 33 | max-height: 20px; 34 | } 35 | .footer-social svg { 36 | width: 20px; 37 | height: 20px; 38 | } 39 | .footer-social svg:hover { 40 | opacity: 0.7; 41 | } 42 | #github-icon { 43 | width: 18px; 44 | height: 18px; 45 | } 46 | #youtube-icon { 47 | width: 38px; 48 | height: 38px; 49 | margin-top: -2px; 50 | margin-right: 0; 51 | } 52 | 53 | @media screen and (max-width: 768px) { 54 | footer { 55 | flex-direction: column-reverse; 56 | } 57 | 58 | .footer-social { 59 | margin-bottom: 8px; 60 | } 61 | 62 | .footer-links { 63 | margin-bottom: 4px; 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /src/_includes/partials/googlecalendar.svg: -------------------------------------------------------------------------------- 1 | 2 | Google Calendar icon 3 | 4 | -------------------------------------------------------------------------------- /src/schedule/2021-03-25-communicate-with-your-audience-with-val-geisler.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Communicate with your Audience, with Val Geisler' 3 | type: Episode Party 4 | date: 2021-03-25 17:00:00 5 | --- 6 | 7 | Live listen and discussion of Val Geisler's [React Podcast](https://reactpodcast.com) episode on communicating with your audience. This episode aired September 12th, 2019 and remains relevant to creators today. 8 | 9 | ## Episode Summary 10 | 11 | This week we diverge from our typical technical focus to talk about communication. 12 | 13 | Many of you are developing a product. 14 | Whether that be an open source library, 15 | course material on your favorite framework, 16 | or your skills a freelance developer — 17 | you are selling something. 18 | 19 | Selling requires more than great technical skills. 20 | It requires strong communication. 21 | 22 | Today we sit with Val Geisler — founder of Fix My Churn. 23 | We talk about communication thru email, 24 | Why it’s critical for building and branding your business, 25 | And how we get started. 26 | 27 | I believe it has the potential to change your career. 28 | 29 | 30 | -------------------------------------------------------------------------------- /src/schedule/2021-03-24-singlethreaded-lauren-tan-individual-contributors-vs-engineering-managers.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Single-Threaded: Lauren Tan on Individual Contributors vs Engineering Managers' 3 | type: Episode Party 4 | date: 2021-03-24 17:00:00 5 | speakers: 6 | - Jenn Creighton 7 | - Lauren Tan 8 | --- 9 | 10 | Each season, [single-threaded](https://anchor.fm/single-threaded/) tackles a new topic in software engineering. This first season, we're exploring feelings. Why do we like some technologies but dislike others? How do our emotions come into play with our career choices? These are some of the questions we'll be answering this season. Episodes are a mix of guest interviews and solo musings. 11 | 12 | Join us on Wednesday, March 24 for a group listen of _single-threaded_. This week, [Jenn](https://twitter.com/gurlcode) and guest [Lauren Tan](https://twitter.com/sugarpirate_) will discuss career paths and compare being an individual contributor to being an engineering manager. We'll be listening together in the `live-event-voice` channel, and sharing our thoughts in the `#single-threaded` channel. 13 | 14 | 15 | -------------------------------------------------------------------------------- /src/schedule/2021-03-18-typescript-graphql-elm-and-product-thinking-with-chris-toomey.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'TypeScript, GraphQL, Elm and Product Thinking with Chris Toomey' 3 | type: Episode Party 4 | date: 2021-03-18 17:00:00 5 | --- 6 | 7 | Live listen and discussion of Val Geisler's [React Podcast](https://reactpodcast.com) episode on communicating with your audience. This episode aired September 12th, 2019 and remains relevant to creators today. 8 | 9 | ## Episode Summary 10 | 11 | This week we diverge from our typical technical focus to talk about communication. 12 | 13 | Many of you are developing a product. 14 | Whether that be an open source library, 15 | course material on your favorite framework, 16 | or your skills a freelance developer — 17 | you are selling something. 18 | 19 | Selling requires more than great technical skills. 20 | It requires strong communication. 21 | 22 | Today we sit with Val Geisler — founder of Fix My Churn. 23 | We talk about communication thru email, 24 | Why it’s critical for building and branding your business, 25 | And how we get started. 26 | 27 | I believe it has the potential to change your career. 28 | 29 | 30 | -------------------------------------------------------------------------------- /src/schedule/2021-01-28-code-and-trust-with-saron-yitbarek.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Code and Trust with Saron Yitbarek 3 | type: Episode Party 4 | date: 2021-01-28 18:00:00 5 | --- 6 | 7 | Live listen and discussion of Saron Yitbarek's [React Podcast](https://reactpodcast.com) episode on the CodeNewbie community. This episode aired May 30, 2019 and remains relevant to React developers today. 8 | 9 | ## Episode Summary 10 | 11 | Saron Yitbarek is the CEO and founder of [CodeNewbie](https://www.codenewbie.org/), the most supportive community of programmers and people learning to code. She's also the vibrant host of the [CodeNewbie Podcast](https://www.codenewbie.org/podcast), [BaseCS Podcast](https://www.codenewbie.org/basecs), and [Command Line Heroes](https://www.redhat.com/en/command-line-heroes) (a Red Hat podcast). 12 | 13 | Chantastic asks her about learning in public, interviewing the world’s greatest developers, the art of storytelling, and aggressive kindness that surround her [#CodeNewbie](https://twitter.com/search?q=%23codenewbie) twitter chats. 14 | 15 | They discuss podcasting, building a community you can trust, showering new developers with love and support, and what it takes to put on the most supportive conference in the world. 16 | 17 | 18 | -------------------------------------------------------------------------------- /src/schedule/2021-01-07-twitch-overlays.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Building Twitch Overlays Using Web Technology 3 | type: Talk 4 | date: 2021-01-07 19:00:00 5 | speakers: 6 | - Ben Myers 7 | --- 8 | 9 | You can [view the finished code on GitHub](https://github.com/LunchDevCommunity/twitch-overlay/)! 10 | 11 | The streaming software [OBS](https://obsproject.com/) lets you use an embedded browser as an input. These means that you can use familiar web technologies to customize your Twitch overlays! 12 | 13 | In this event, we covered: 14 | 15 | - Using OBS's `Browser` source 16 | - The [tmi.js](https://tmijs.com/) and [ComfyJS](https://github.com/instafluff/ComfyJS) JavaScript libraries for getting Twitch chat events 17 | - Using DOM manipulation to display chat messages 18 | - Using `overflow` and flexbox in CSS to get the rising chatbox feel 19 | 20 | {% youtube-video 'https://youtu.be/aJiIF9I6fuc' %} 21 | 22 | ## Mentioned Resources 23 | 24 | - [tmi.js](https://tmijs.com/) - a JavaScript library for hooking up your code to a Twitch chat 25 | - [ComfyJS](https://github.com/instafluff/ComfyJS) - a community-built wrapper around tmi.js that's a little more dev-friendly 26 | - [John Otander's post on `tomato`](https://johno.com/tomato/) - John agrees that `tomato` is the best named CSS color 27 | -------------------------------------------------------------------------------- /src/schedule/2021-01-15-add-social-cards-to-eleventy-site.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Add Social Cards to an Eleventy Site 3 | description: We'll be adding them to the Eleventy site but the knowledge is totally transferrable to other places on the web. 4 | type: Mob Job 5 | date: 2021-01-15 18:00:00 6 | speakers: 7 | - Michael Chan 8 | --- 9 | 10 | We've been learning a ton about Eleventy by building up https://events.lunch.dev/. 11 | The next big project is creating "social cards". 12 | We'll be adding them to the Eleventy site but the knowledge is totally transferrable to other places on the web. 13 | 14 | We'll be learning too! So, no previous experience required just bring your curiosity :partying_face: 15 | 16 | [See our pull request!](https://github.com/LunchDevCommunity/community-calendar/pull/26) 17 | 18 | ## Helpful Links 19 | 20 | - [Community calendar repo](https://github.com/LunchDevCommunity/community-calendar) 21 | - [Automatically Generate Social Images for Blog Posts](https://www.learnwithjason.dev/blog/auto-generate-social-image/) 22 | - [Twitter Cards docs](https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards) 23 | - [Twitter Card Validator](https://cards-dev.twitter.com/validator) 24 | - [Eleventy's Data Cascade](https://www.11ty.dev/docs/data-cascade/) 25 | - [Cloudinary](https://cloudinary.com/) 26 | - [Publix Subs](https://ww4.publix.com/products-services/deli/online-easy-ordering) 27 | -------------------------------------------------------------------------------- /src/schedule/2021-04-07-styling-and-component-libraries-round-table.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Round Table: Styling & Component Libraries In React' 3 | type: Round Table 4 | date: 2021-04-07 17:00:00 5 | speakers: 6 | - Michael Gee 7 | --- 8 | 9 | ## Round Table [0] 🎉 10 | 11 | Round tables are an improv event where we choose any given topic while **strongly encouraging** everyone to participate talking about their experience/interest in the topic. 12 | 13 | I'm someone who gets too heavily invested in the technologies that I use so I always want to hear alternative approaches to cure my ignorance of finding new ways of building things. These group events (I hope) will be a a great way to introduce new things/ways of doing things and giving some insight to why people would choose one thing over another. 14 | 15 | Also if people have really strong opinions towards one side or another it will be a perfect opportunity for me to throw them and someone else on the other side into the #debategladiatorcolosseum to battle it out to the death. (haha I'm only jok... being serious 😉) 16 | 17 | --- 18 | 19 | This round table's topic is around styling and/or using component libraries in React and will revolve around these 3 questions: 20 | 21 | 1. What do you currently use for work (or your current projects)? 22 | 2. What would you use if you started a brand new project today? 23 | 3. If you couldn't use your first choice, what would be your second? 24 | -------------------------------------------------------------------------------- /src/schedule/2021-05-05-advice-to-my-younger-self-round-table.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'Round Table: Advice To My Younger Self' 3 | type: Round Table 4 | date: 2021-05-05 17:00:00 5 | speakers: 6 | - Michael Gee 7 | --- 8 | 9 | ## Round Table [1] 🎉 10 | 11 | Round tables are an improv event where we choose any given topic while **strongly encouraging** everyone to participate talking about their experience/interest in the topic. 12 | 13 | I'm someone who can get too heavily invested in the ways that I do things or the technologies that I use so I always want to hear alternative perspectives to cure my ignorance of finding new approaches or solutions. These group events (I hope) will be a a great way to introduce new things/ways of doing things and giving some insight to why people would choose one thing over another. 14 | 15 | --- 16 | 17 | This round table's topic is the advice you would give to your younger self that would drastically accelerate you to where you are today. This can be at any point in your personal timeline whether it was when you were transitioning from beginner to junior, junior to senior, or maybe even senior to lead. 18 | 19 | ![But wait, there's more](https://media.giphy.com/media/9V1F9o1pBjsxFzHzBr/giphy.gif) 20 | 21 | Along with providing one piece of career || technical advice, you can optionally also throw in a piece of advice involving anything else of your choice. 22 | 23 | {% youtube-video "https://youtu.be/VAx8CM6XYgw" %} 24 | -------------------------------------------------------------------------------- /src/_includes/partials/join-discord-button.html: -------------------------------------------------------------------------------- 1 | 2 | 15 | Join Discord 16 | 30 | 31 | -------------------------------------------------------------------------------- /src/css/homepage.css: -------------------------------------------------------------------------------- 1 | .events-section { 2 | display: flex; 3 | flex-wrap: wrap; 4 | margin: 0; 5 | } 6 | 7 | .events-title { 8 | margin-left: 16px; 9 | } 10 | 11 | .event-item { 12 | position: relative; 13 | width: calc(33% - 32px); 14 | min-height: 140px; 15 | margin: 16px; 16 | padding: 16px; 17 | box-shadow: rgba(0, 0, 0, 0.11) 0px 1.2px 3.6px, rgba(0, 0, 0, 0.11) 0px 6.4px 14.4px; 18 | background-color: white; 19 | 20 | display: flex; 21 | flex-direction: column; 22 | } 23 | 24 | .event-item__speaker-list { 25 | padding-block-start: 1rem; 26 | --avatar--size: 2.5rem; 27 | flex-wrap: wrap; 28 | } 29 | 30 | .event-item__speaker-list [data-avatar] { 31 | box-shadow: 1px 1px 0 -1px hsla(0, 0%, 0%, 0.4); 32 | } 33 | 34 | .event-item .subtitle { 35 | color: #78757f; 36 | font-style: italic; 37 | align-items: stretch; 38 | font-size: 0.8em; 39 | } 40 | 41 | .fg1 { 42 | flex-grow: 1; 43 | } 44 | 45 | .event-item a { 46 | background-color: black; 47 | color: white; 48 | text-decoration: none; 49 | padding: 4px 8px; 50 | border-radius: 8px; 51 | 52 | display: block; 53 | align-self: flex-end; 54 | width: fit-content; 55 | 56 | margin-top: 1em; 57 | } 58 | 59 | .event-item a:hover { 60 | opacity: 0.8; 61 | } 62 | 63 | .event-item a:focus-visible { 64 | outline-color: #ba8d1c; 65 | outline-offset: 5px; 66 | outline-style: dotted; 67 | outline-width: 2px; 68 | } 69 | 70 | .event-item a:active { 71 | transform: scaleX(0.95); 72 | } 73 | 74 | #upcoming-events-section .event-item a { 75 | background-color: gold; 76 | color: black; 77 | } 78 | 79 | #past-events-section .event-item a { 80 | background-color: #495057; 81 | } 82 | 83 | @media screen and (max-width: 960px) { 84 | .event-item { 85 | width: calc(50% - 32px); 86 | } 87 | } 88 | 89 | @media screen and (max-width: 600px) { 90 | .events-title { 91 | text-align: center; 92 | } 93 | 94 | .events-section { 95 | flex-direction: column; 96 | } 97 | 98 | .event-item { 99 | width: calc(100% - 32px); 100 | } 101 | } 102 | -------------------------------------------------------------------------------- /src/schedule/schedule.11tydata.js: -------------------------------------------------------------------------------- 1 | const { google, outlook, office365, ics } = require('calendar-link'); 2 | const { isBefore } = require('date-fns'); 3 | const { getAvatarUrl } = require('../utils/person'); 4 | const url = 'https://discord.gg/lunchdev'; 5 | const location = 'Lunch Dev Community Discord at events.lunch.dev'; 6 | 7 | function updateDesc(description, url) { 8 | const newDescription = description 9 | ? ` 10 | Learn with us in the Lunch Dev Community Discord at ${url} 11 | 12 | ${description} 13 | ` 14 | : `Learn with us in the Lunch Dev Community Discord at ${url}`; 15 | return newDescription; 16 | } 17 | 18 | module.exports = { 19 | eleventyComputed: { 20 | calendarLinks: { 21 | isPastEvent: ({ date: start }) => { 22 | return isBefore(new Date(), new Date(start)); 23 | }, 24 | googleLink: ({ title, description, date: start }) => { 25 | return google({ 26 | title, 27 | description: updateDesc(description, url), 28 | start, 29 | duration: [1, 'hour'], 30 | location, 31 | url, 32 | }); 33 | }, 34 | outlookLink: ({ title, description, date: start }) => { 35 | return outlook({ 36 | title, 37 | description: updateDesc(description, url), 38 | start, 39 | duration: [1, 'hour'], 40 | location, 41 | url, 42 | }); 43 | }, 44 | officeLink: ({ title, description, date: start }) => { 45 | return office365({ 46 | title, 47 | description: updateDesc(description, url), 48 | start, 49 | duration: [1, 'hour'], 50 | location, 51 | url, 52 | }); 53 | }, 54 | icsLink: ({ title, description, date: start }) => { 55 | return ics({ 56 | title, 57 | description: updateDesc(description, url), 58 | start, 59 | duration: [1, 'hour'], 60 | location, 61 | url, 62 | }); 63 | }, 64 | }, 65 | speakerDetails: function (data) { 66 | if (!data.speakers) { 67 | return []; 68 | } 69 | 70 | return data.speakers.map((speaker) => ({ 71 | name: speaker, 72 | avatar: getAvatarUrl(data.people[speaker]), 73 | })); 74 | }, 75 | }, 76 | }; 77 | -------------------------------------------------------------------------------- /src/_includes/partials/event-sesh-command.html: -------------------------------------------------------------------------------- 1 |
2 | 54 |

Discord Sesh Command

55 |

Paste this sesh command into a Discord channel to create a joinable event:

56 |
57 | !create {{title}} on {{ date | asDateTime }} 58 |
59 |
60 |
61 |
Title
62 |
{{title}}
63 |
Time
64 |
{{date | asDateTime}}
65 |
Duration
66 |
1hr
67 |
Color
68 |
69 |
React Podcast:
70 |
Some Antics:
71 |
single-threaded:
72 |
73 |
74 |
75 | -------------------------------------------------------------------------------- /src/schedule/2021-04-23-lightning.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: '⚡ Lightning Talk Extravaganza' 3 | type: Talk 4 | date: 2021-04-23 17:00:00 5 | speakers: 6 | - Ferit Topcu 7 | - Toby Baratta 8 | - Adrianne Mallett 9 | - Alex Anderson 10 | - Ben Myers 11 | - Michael Chan 12 | --- 13 | 14 | **Six speakers. Five minutes each.** 15 | 16 | Join us on April 23 as we give rapid-fire introductions to some of the things that we've learned. The lightning talks are: 17 | 18 | | Speaker | Talk | Resources | 19 | | ------------------------------- | --------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ | 20 | | Ferit Topcu | 5 Mental Models to Help In Your Career | [Ferit's slides](https://app.pitch.com/app/public/presentation/69f7599c-0828-4115-9f5e-b7869d20b323) | 21 | | Toby Baratta | Drink Espresso; Don't Be Depresso: Coming Up For Air When Deep In a Problem | [Toby's slides](https://drive.google.com/file/d/1mfIpA1916fevjur8qkTEH643ryVLjASW/view?usp=sharing) | 22 | | Adrianne Mallett | It's ~~Rude~~ An Antipattern to Not Use Semantic Versioning | [Adrianne's slides](https://drive.google.com/file/d/1xCf9ZzStuSq44gPTltcxOmaJzOIp9qOA/view?usp=sharing) | 23 | | Alex Anderson _(via recording)_ | A Few Delightful User Interactions | 24 | | Ben Myers | On the `
`: The Semantics You Never Knew You Needed | [Ben's slides](https://docs.google.com/presentation/d/1MfWxT_sAhuNQEPq4Y0OnGvt5dL5SUzvdGAtHiGOiAKo/edit?usp=sharing) | 25 | | Chantastic | CSS-ing with Attribute Selectors | [Chan's pen](https://codepen.io/chantastic/pen/eYgPQjb) and [his blogpost](https://chan.dev/posts/css-ing-with-attribute-selectors/) | 26 | -------------------------------------------------------------------------------- /src/css/styles.css: -------------------------------------------------------------------------------- 1 | [data-typeface='system-ui'] { 2 | font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', 3 | sans-serif; 4 | } 5 | 6 | /* TODO: consider more advanced Grid layout 7 | * https://www.joshwcomeau.com/css/full-bleed/ 8 | */ 9 | :root { 10 | --pageContentWidth: 72ch; 11 | --mainPadding: calc(100% - var(--pageContentWidth)); 12 | } 13 | 14 | body { 15 | background-color: #f5f5f5; 16 | } 17 | 18 | [data-layout='centered-single-column'] { 19 | padding: 0 calc(var(--mainPadding) / 4); 20 | } 21 | 22 | [data-responsive-youtube--container] { 23 | position: relative; 24 | width: 100%; 25 | height: 0; 26 | padding-bottom: 56.25%; 27 | margin: 1em 0; 28 | } 29 | 30 | [data-responsive-youtube--container] > iframe { 31 | position: absolute; 32 | top: 0; 33 | left: 0; 34 | width: 100%; 35 | height: 100%; 36 | } 37 | 38 | main { 39 | padding: 0 16px; 40 | } 41 | 42 | main > * + * { 43 | margin-top: 1.5em; 44 | } 45 | 46 | main:last-child { 47 | margin-bottom: 3.2em; 48 | } 49 | 50 | h1, 51 | h2, 52 | h3, 53 | h4, 54 | h5, 55 | h6 { 56 | font-family: 'Alegreya Sans', sans-serif; 57 | } 58 | 59 | h1 { 60 | font-size: 40pt; 61 | } 62 | 63 | main > h2 { 64 | font-size: 28pt; 65 | } 66 | 67 | main > h3 { 68 | font-size: 20pt; 69 | } 70 | 71 | aside > h2, 72 | aside > h3 { 73 | font-size: 24px; 74 | } 75 | 76 | code { 77 | font-family: 'Source Code Pro', monospace; 78 | font-style: italic; 79 | } 80 | 81 | aside { 82 | background-color: lightgoldenrodyellow; 83 | border-left: 3px solid gold; 84 | padding: 3%; 85 | margin: 3em 1.5em; 86 | } 87 | 88 | aside > * + * { 89 | margin-top: 1.5em; 90 | } 91 | 92 | .cta-links { 93 | text-align: right; 94 | } 95 | 96 | .cta-links a { 97 | text-decoration: none; 98 | color: black; 99 | font-weight: 600; 100 | background-color: white; 101 | border-radius: 5%; 102 | border: 2px solid gold; 103 | padding: 2%; 104 | display: inline-block; 105 | margin-left: 0.5em; 106 | } 107 | 108 | .cta-links a:active { 109 | transform: scaleX(0.95); 110 | } 111 | 112 | .cta-links a:hover { 113 | background-color: whitesmoke; 114 | } 115 | 116 | .cta-links a:focus { 117 | background-color: whitesmoke; 118 | border-color: goldenrod; 119 | outline: 3px solid transparent; 120 | } 121 | -------------------------------------------------------------------------------- /src/schedule/2021-01-19-hijacking-screenreaders-with-css.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Hijacking Screenreaders with CSS 3 | type: Talk 4 | date: 2021-01-19 18:00:00 5 | speakers: 6 | - Ben Myers 7 | --- 8 | 9 | **Mislead screenreaders** into changing how they announce content or into forgetting the underlying semantics of your page — **one CSS rule at a time.** Behold, the chaos that can be caused with just a single `list-style: none` or a `text-transform: uppercase`! We'll challenge the separation of presentation and content, go on a tour through browser and operating system internals, and learn how our page is exposed to assistive technology. **You won't want to miss this one.** 10 | 11 | Ben Myers is a frontend developer with a passion for accessibility. He is a Software Engineer II at USAA's bank. He blogs about web accessibility at [benmyers.dev](https://benmyers.dev), and is about to start [streaming about accessibility and semantics on Twitch](https://twitch.tv/SomeAnticsDev)! You can find him on Twitter at [@BenDMyers](https://twitter.com/bendmyers). 12 | 13 | {% youtube-video 'https://youtu.be/OYVxsWCE7rE' %} 14 | 15 | ## Helpful Links 16 | 17 | - [Get the slides!](https://benmyers.dev/assets/slides/Hijacking%20Screenreaders%20with%20CSS%20-%20ReactJS%20Dallas.pptx) 18 | - [Play with the demos!](https://hijacking-screenreaders-with-css-demos.netlify.app/) 19 | - Ben's blogposts about [the accessibility tree](https://benmyers.dev/blog/accessibility-tree/) and [how CSS can influence screenreaders](https://benmyers.dev/blog/css-can-influence-screenreaders/), which inspired this talk 20 | - ["Screen Readers and CSS: Are We Going Out of Style (and into Content)?"](https://webaim.org/blog/screen-readers-and-css/) by John Northup for the WebAIM Blog 21 | - [Core Accessibility API Mappings 1.2](https://www.w3.org/TR/core-aam-1.2/) 22 | - ["The Accessibility Tree Training Guide"](http://whatsock.com/training/) by WhatSock 23 | - [Table heuristics in the Chromium source code](https://chromium.googlesource.com/chromium/blink/+/master/Source/modules/accessibility/AXTable.cpp) 24 | - [Table heuristics in the Firefox source code](https://dxr.mozilla.org/mozilla-central/source/accessible/generic/TableAccessible.cpp) 25 | - ["Tables, CSS Display Properties, and ARIA"](https://adrianroselli.com/2018/02/tables-css-display-properties-and-aria.html) by Adrian Roselli 26 | - [James Craig's thread on WebKit and lists](https://twitter.com/cookiecrook/status/1337226933822603270) 27 | -------------------------------------------------------------------------------- /src/_data/contributions.json: -------------------------------------------------------------------------------- 1 | { 2 | "a11y": { 3 | "name": "Accessibility", 4 | "emoji": "♿️" 5 | }, 6 | "audio": { 7 | "name": "Audio", 8 | "emoji": "🔊" 9 | }, 10 | "blog": { 11 | "name": "Blogging" 12 | }, 13 | "bug": { 14 | "name": "Bug Reports", 15 | "emoji": "🐛" 16 | }, 17 | "business": { 18 | "name": "Business Development", 19 | "emoji": "💼" 20 | }, 21 | "code": { 22 | "name": "Code", 23 | "emoji": "💻" 24 | }, 25 | "content": { 26 | "name": "Content", 27 | "emoji": "🖋" 28 | }, 29 | "data": { 30 | "name": "Data", 31 | "emoji": "🔣" 32 | }, 33 | "design": { 34 | "name": "Design", 35 | "emoji": "🎨" 36 | }, 37 | "doc": { 38 | "name": "Documentation", 39 | "emoji": "📖" 40 | }, 41 | "eventOrganizing": { 42 | "name": "Event Organizing", 43 | "emoji": "📋" 44 | }, 45 | "example": { 46 | "name": "Examples", 47 | "emoji": "💡" 48 | }, 49 | "financial": { 50 | "name": "Financial Support", 51 | "emoji": "💵" 52 | }, 53 | "fundingFinding": { 54 | "name": "Funding/Grant Finder", 55 | "emoji": "🔍" 56 | }, 57 | "ideas": { 58 | "name": "Ideas & Planning", 59 | "emoji": "🤔" 60 | }, 61 | "infra": { 62 | "name": "Infrastructure", 63 | "emoji": "🚇" 64 | }, 65 | "maintenance": { 66 | "name": "Maintenance", 67 | "emoji": "🚧" 68 | }, 69 | "mentorship": { 70 | "name": "Mentorship", 71 | "emoji": "🧑‍🏫" 72 | }, 73 | "platform": { 74 | "name": "Platform", 75 | "emoji": "📦" 76 | }, 77 | "plugin": { 78 | "name": "Plugins & Utility Libraries", 79 | "emoji": "🔌" 80 | }, 81 | "projectManagement": { 82 | "name": "Project Management", 83 | "emoji": "📆" 84 | }, 85 | "question": { 86 | "name": "Question Answerer", 87 | "emoji": "💬" 88 | }, 89 | "research": { 90 | "name": "Research", 91 | "emoji": "🔬" 92 | }, 93 | "review": { 94 | "name": "Reviewed Pull Requests", 95 | "emoji": "👀" 96 | }, 97 | "security": { 98 | "name": "Security", 99 | "emoji": "🛡️" 100 | }, 101 | "tool": { 102 | "name": "Tooling", 103 | "emoji": "🔧" 104 | }, 105 | "translation": { 106 | "name": "Translation", 107 | "emoji": "🌍" 108 | }, 109 | "test": { 110 | "name": "Tests", 111 | "emoji": "⚠️" 112 | }, 113 | "tutorial": { 114 | "name": "Tutorials", 115 | "emoji": "✅" 116 | }, 117 | "talk": { 118 | "name": "Talks", 119 | "emoji": "📢" 120 | }, 121 | "userTesting": { 122 | "name": "User Testing", 123 | "emoji": "📓" 124 | }, 125 | "video": { 126 | "name": "Videos", 127 | "emoji": "📹" 128 | } 129 | } 130 | -------------------------------------------------------------------------------- /src/schedule/2021-08-12-typeScript-in-50-lessons-book-club-intro.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'TypeScript in 50 Lessons — Intro' 3 | type: Club 4 | date: 2021-08-12 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Welcome to the TypeScript in 50 Lessons club! 10 | 11 | This is a short-term community group for owners of the book TypeScript in 50 Lessons. The only requirement is that you own the book. 12 | 13 | - [Amazaon — Kindle-only](https://amzn.to/3lr3ahA) (affiliate link) 14 | - [Smashing Magazine — all formats](https://typescript-book.com) 15 | 16 | During this first group, we'll cover the introduction, learning expectations, format, and appetite for future meetings. 17 | 18 | ## Notes 19 | 20 | ### Why are you interested in TypeScript? 21 | 22 | - **MG**: props 23 | - **BM**: 24 | - Hype, keeping up with the industry 25 | - Already has a toe dipped in via JSDoc 26 | - People often introduce one of two ways: 27 | - "JS devs are bad at their jobs and need TS" 28 | - "Better dev tooling for existing code" 29 | - **TWM**: 30 | - Used it at work 31 | - Identifying what you don't know you don't know 32 | - **MA**: 33 | - Getting foundation right 34 | - **VP**: 35 | - Dev Tooling 36 | - Large teams sharing 37 | - **FT**: 38 | - Working with TS for months but getting lost in complications 39 | - Career development 40 | 41 | ### Which structural typed languages have you used? 42 | 43 | - C# 44 | - Java 45 | - Scala 46 | 47 | ### Takeaways from Intro 48 | 49 | #### Values 50 | 51 | - Properly used TypeScript can be like pairing with your past self 52 | - Guides refactoring 53 | - Errors at "authoring" time 54 | - We can progressively migrate to TypeScript 55 | 56 | #### Identity 57 | 58 | > If there are "TypeScript Devs," I guess the rest of us are "Babel Devs" 59 | 60 | #### De-motivations 61 | 62 | - Condescending community (JS devs are less than) 63 | 64 | #### Persona to avoid 65 | 66 | - Proselyte 67 | - "Superman for problems that don't exist" — BM 68 | 69 | #### Persona to embrace 70 | 71 | - Acknowledge business constraints 72 | - Not everyone is allowed to use TS 73 | - Progressive adoption (use TS where it provides the most lift) 74 | 75 | ### Places where TypeScript might not be a great fit 76 | 77 | - Action faking 78 | - "I just need to improve these types before starting that feature…" 79 | - "Types are like concrete. They provide a strong foundation, if a rigid foundation is what you need" 80 | - "gluing lego together" 81 | - Ask Kyle Simpson's question "What are you losing with TypeScript?" 82 | - Where exploration speed of exploration is a high value 83 | 84 | ### Chapters we're most excited about 85 | 86 | - Generics 87 | - Conditional Types 88 | -------------------------------------------------------------------------------- /src/_data/someAntics.js: -------------------------------------------------------------------------------- 1 | const Cache = require('@11ty/eleventy-cache-assets'); 2 | 3 | /** 4 | * Transforms a stream provided by the Some Antics API into a page fit for the upcomingEvents collection. 5 | * @param {Stream} stream 6 | * @returns {CollectionItem} stream in collection item format 7 | */ 8 | function convertStreamToCollectionItem(stream) { 9 | return { 10 | data: { 11 | date: new Date(stream.date), 12 | speakerDetails: stream.hosts.map((host) => ({ 13 | name: host.name, 14 | avatar: host.avatar, 15 | })), 16 | speakers: stream.hosts.map((host) => host.name), 17 | title: `Some Antics: ${stream.fullTitle}`, 18 | type: 'Live Event', 19 | }, 20 | url: stream.url, 21 | }; 22 | } 23 | 24 | /** 25 | * Fetches and caches upcoming Some Antics streams 26 | * @returns {CollectionItem[]} list of upcoming streams 27 | */ 28 | module.exports = function () { 29 | const endpoint = 'https://someantics.dev/api/upcomingStreams.json'; 30 | return Cache(endpoint, { duration: '1d', type: 'json' }).then((res) => 31 | res.events.map(convertStreamToCollectionItem).splice(0, 4) 32 | ); 33 | }; 34 | 35 | /** 36 | * @typedef {object} Stream 37 | * @property {string} title event title (in short form, if one is needed) 38 | * @property {string} fullTitle event title (in long form, if one is needed) 39 | * @property {string} date event start time in ISO format 40 | * @property {string} description a full description of the event 41 | * @property {string} slug an identifier for the event, unique from others in the same series 42 | * @property {string} url a URL for finding more information about the event 43 | * @property {Host[]} hosts list of people who could be said to be running or hosting the event 44 | * @property {Object} calendarLinks a map of (optional) "Add to Calendar" links 45 | * @property {string} [calendarLinks.google] an (optional) "Add to Google Calendar" link 46 | */ 47 | 48 | /** 49 | * @typedef {object} Host one of potentially many people who could be said to be "hosting" an event 50 | * @property {string} name host's full name 51 | * @property {string} avatar image source for host's avatar 52 | * @property {string} pronouns host's pronouns 53 | * @property {string} [instagram] host's Instagram username (without the `@` sign) 54 | * @property {string} [twitter] host's Twitter username (without the `@` sign) 55 | * @property {string} [website] URL for a meaningful personal site pertaining to the host 56 | */ 57 | 58 | /** 59 | * @typedef {object} CollectionItem 60 | * @property {object} data 61 | * @property {Date} data.date event start time 62 | * @property {string[]} data.speakers 63 | * @property {string} data.title 64 | * @property {string} data.type 65 | * @property {string} fileSlug 66 | * @property {string} url 67 | */ 68 | -------------------------------------------------------------------------------- /src/css/elements.css: -------------------------------------------------------------------------------- 1 | [data-icon] { 2 | display: var(--icon--display, inline-block); 3 | width: var(--icon--width, 1em); 4 | height: var(--icon--height, 1em); 5 | fill: var(--icon--fill, currentColor); 6 | } 7 | 8 | [data-icon='inline'] { 9 | --icon--width: 1.25em; 10 | --icon--height: 1.25em; 11 | vertical-align: -0.25em; 12 | display: inline-block; 13 | width: 1.25em; 14 | height: 1.25em; 15 | vertical-align: -0.25em; 16 | fill: currentColor; 17 | } 18 | 19 | [data-button] { 20 | -moz-appearance: none; 21 | -moz-user-select: none; 22 | -ms-user-select: none; 23 | -webkit-appearance: none; 24 | -webkit-user-select: none; 25 | appearance: none; 26 | box-sizing: border-box; 27 | border-width: var(--button--border-width, 1px); 28 | border-style: solid; 29 | border-color: var(--button--border-color, fuchsia); 30 | background-image: var(--button--background-image); 31 | background-color: var(--button--background-color, fuchsia); 32 | border-radius: var(--button--border-radius, 4px); 33 | color: var(--button--color, blue); 34 | cursor: pointer; 35 | display: inline-block; 36 | font-weight: var(--button--font-weight, 600); 37 | position: relative; 38 | user-select: none; 39 | vertical-align: middle; 40 | white-space: nowrap; 41 | transition: 100ms all ease-in-out; 42 | font-size: var(--button--font-size, 14px); 43 | padding: var(--button--padding, 0 16px); 44 | line-height: calc(var(--button--height, 32px) - calc(var(--button--border-width, 1px) * 2)); 45 | box-shadow: var(--button--box-shadow); 46 | background-image: var(--button--background-image); 47 | } 48 | input[type='submit'][data-button] { 49 | text-align: center; 50 | } 51 | button[data-button] { 52 | } 53 | a[data-button] { 54 | text-align: center; 55 | text-decoration: none; 56 | } 57 | 58 | [data-avatar] { 59 | box-sizing: border-box; 60 | width: var(--avatar--size, 4rem); 61 | height: var(--avatar--size, 4rem); 62 | border-radius: 100%; 63 | } 64 | 65 | [data-card] { 66 | background-color: white; 67 | } 68 | 69 | [data-unstyled-list] { 70 | box-sizing: border-box; 71 | list-style-type: none; 72 | padding: 0; 73 | margin: 0; 74 | } 75 | 76 | [data-speaker-grid] { 77 | display: grid; 78 | grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); 79 | gap: 1rem; 80 | } 81 | 82 | [data-flex-stack] { 83 | display: flex; 84 | flex-direction: var(--flex-stack--direction, column); 85 | align-items: center; 86 | gap: var(--flex-stack--gap, 1rem); 87 | } 88 | 89 | @supports (flex: gap) { 90 | [data-flex-stack] * + * { 91 | padding-block-start: var(--flex-stack--gap, 1rem); 92 | } 93 | } 94 | 95 | [data-box] { 96 | box-sizing: var(--box--box-sizing); 97 | padding: var(--box--padding); 98 | margin: var(--box--margin); 99 | } 100 | -------------------------------------------------------------------------------- /src/schedule/2021-08-19-typescript-in-50-lessons-chapter-1.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'TypeScript in 50 Lessons — Chapter One' 3 | type: Club 4 | date: 2021-08-19 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Join us this week for Chapter One of TypeScript in 50 Lessons. Lessons include: 10 | 11 | - Lesson 1: Red Squiggly Lines 12 | - Lesson 2: Hunting Bugs 13 | - Lesson 3: Types 14 | - Lesson 4: Adding Types with JSDoc 15 | - Lesson 5: Type Declaration Files 16 | - Lesson 6: Ambiant Declaration Files 17 | - Lesson 7: Tooling 18 | 19 | Come with questions concerns, and curiosity! 20 | 21 | This is a short-term community group for owners of the book TypeScript in 50 Lessons. The only requirement is that you own the book. 22 | 23 | - [Amazaon — Kindle-only](https://amzn.to/3lr3ahA) (affiliate link) 24 | - [Smashing Magazine — all formats](https://typescript-book.com) 25 | 26 | ## Notes 27 | 28 | ### Terms 29 | 30 | - Property Descriptor, p27 31 | - assignable, p27 32 | - type inference, p30 33 | - eponymous types, p34 34 | - primitive type (number, boolean, string), p36 35 | - composite type (object, array, function), p36 36 | - weakly typed, p36 37 | - strongly typed, p37 38 | - shape, p38 39 | - structural type system, p39 40 | - custom type, p42 41 | - type declaration file (`.d.ts`), p47 42 | - ambiant type declarations, p53 43 | - `tsc`, p58 44 | - `tsconfig.json`, p60 45 | 46 | ### High-level takeaways 47 | 48 | - TM: You can use TypeScript w/o TypeScript 🤯 49 | - VP: You can progressively adopt TypeScript tooling 50 | - The power of [IntelliSense](https://code.visualstudio.com/docs/editor/intellisense) 51 | 52 | ### Additional takeaways 53 | 54 | - MC: Love framing of "type-checking is spell-checking for code." It minimizes the intimidation of a new language while retaining the effectiveness 55 | - TWM: Looking at the first example, I was thinking about all the bugs we humans miss in code review 56 | - MC: TS is like a programming pair with perfect knowledge of JavaScript 57 | - VP: TS is excellent at helping with tricky to spot typographical errors like pluralization. e.g., `CombidedDecision`, `combineDecisions` 58 | - TWM/BM: We can use `//@ts-check` privately. We don't even have to check it into version control. Enable at and disable it locally as needed 59 | - TWM: JS has types! It just doesn't care about them. You have to. "Weakly typed" 60 | - [Just JavaScript](https://justjavascript.com) shout out 61 | - [WAT](https://destroyallsoftware.com/talks/wat), a lightning talk by Gary Bernhardt from CodeMash 2012 62 | - MC: Do we have hope that we can sweep away the outdated practices with new ones? (the w3schools issue). New practices become legacy practices. 63 | - BM: No. No hope 😄. Because "we don't break the web". Compilers are a fixed point where we can say (use this compiler version). Closest thing in JS might be Node.js version 64 | - BM: "Don't [burninate](https://www.urbandictionary.com/define.php?term=Burninate) Flash" <- If Ben was in charge of Flash marketing, we'd still have Flash 65 | - TWM: jQuery support might be why Typescript won 66 | -------------------------------------------------------------------------------- /.eleventy.js: -------------------------------------------------------------------------------- 1 | const markdownIt = require('markdown-it'); 2 | const emoji = require('markdown-it-emoji'); 3 | const eleventyPluginFilesMinifier = require('@sherby/eleventy-plugin-files-minifier'); 4 | const { comparators } = require('generate-comparators'); 5 | const getTwitchChannelEmbed = require('./src/utils/get-twitch-channel-embed'); 6 | const getYouTubeVideoEmbed = require('./src/utils/get-youtube-video-embed'); 7 | const personUtils = require('./src/utils/person'); 8 | 9 | const { isAfter, isBefore, format, isToday } = require('date-fns'); 10 | 11 | const isProduction = process.env.NODE_ENV === 'production'; 12 | // It's value taken in scripts(package.json) returned boolean 13 | 14 | const isValidTitle = (title = '') => title.trim().length > 2; 15 | const isValidEvent = (event) => isValidTitle(event.data.title); 16 | 17 | const byDate = comparators((event) => event.data.date); 18 | 19 | module.exports = (eleventyConfig) => { 20 | eleventyConfig.addCollection('events', (collectionApi) => { 21 | return collectionApi.getFilteredByGlob('./src/schedule/*.md'); 22 | }); 23 | 24 | eleventyConfig.addCollection('pastEvents', (collectionApi) => { 25 | return collectionApi 26 | .getFilteredByGlob('./src/schedule/*.md') 27 | .filter((event) => isValidEvent(event) && isBefore(new Date(event.data.date), new Date())); 28 | }); 29 | 30 | eleventyConfig.addCollection('upcomingEvents', (collectionApi) => { 31 | const serverEvents = collectionApi 32 | .getFilteredByGlob('./src/schedule/*.md') 33 | .filter((event) => isValidEvent(event) && isAfter(new Date(event.data.date), new Date())); 34 | 35 | const someAnticsStreams = collectionApi.items[0].data.someAntics; 36 | 37 | return [...serverEvents, ...someAnticsStreams].sort(byDate.asc); 38 | }); 39 | 40 | let markdown = markdownIt({ 41 | typographer: true, 42 | html: true, 43 | }); 44 | 45 | markdown.use(emoji); 46 | 47 | eleventyConfig.setLibrary('md', markdown); 48 | 49 | eleventyConfig.addPassthroughCopy('src/assets'); 50 | eleventyConfig.addPassthroughCopy('src/css'); 51 | eleventyConfig.addPassthroughCopy('src/js'); 52 | eleventyConfig.addPassthroughCopy('_redirects'); 53 | 54 | eleventyConfig.addFilter('asDateOnly', function (date) { 55 | return format(new Date(date), 'PP'); 56 | }); 57 | 58 | eleventyConfig.addFilter('toISOString', function (date) { 59 | return new Date(date).toISOString(); 60 | }); 61 | 62 | eleventyConfig.addShortcode('twitch', getTwitchChannelEmbed); 63 | eleventyConfig.addShortcode('youtube-video', getYouTubeVideoEmbed); 64 | eleventyConfig.addFilter('asDateTime', function (date) { 65 | return `${format(new Date(date), 'MMM d, yyyy p')} PST`; 66 | }); 67 | 68 | eleventyConfig.addFilter('pageSourcePath', function (inputPath) { 69 | return `https://github.com/LunchDevCommunity/community-calendar/edit/main/${inputPath.replace('./', '')}`; 70 | }); 71 | 72 | eleventyConfig.addFilter('personAvatar', personUtils.getAvatarUrl); 73 | 74 | if (isProduction) { 75 | eleventyConfig.addPlugin(eleventyPluginFilesMinifier); 76 | } 77 | 78 | return { 79 | dir: { 80 | input: './src/', 81 | }, 82 | }; 83 | }; 84 | -------------------------------------------------------------------------------- /src/_data/people.json: -------------------------------------------------------------------------------- 1 | { 2 | "Adrianne Mallett": { 3 | "avatar_url": "https://res.cloudinary.com/bendmyers/image/upload/v1617491898/Some%20Antics%20Avatars/Adrianne%20Mallett.jpg" 4 | }, 5 | "Alex Anderson": { 6 | "github": "alexanderson1993" 7 | }, 8 | "Alex Trost": { 9 | "github": "a-trost" 10 | }, 11 | "Anna E. Cook": { 12 | "avatar_url": "https://res.cloudinary.com/bendmyers/image/upload/v1624545423/Some%20Antics%20Avatars/Anna%20E.%20Cook.jpg" 13 | }, 14 | "Anne-Mieke Bovelett": { 15 | "avatar_url": "https://res.cloudinary.com/bendmyers/image/upload/w_1000,c_fill,ar_1:1,g_auto,r_max/v1620394752/Some%20Antics%20Avatars/Anne-Mieke%20Bovelett.jpg" 16 | }, 17 | "Anthony Campolo": { 18 | "github": "ajcwebdev" 19 | }, 20 | "Austin Crim": { 21 | "github": "austincrim" 22 | }, 23 | "Ben Ilegbodu": { 24 | "github": "benmvp" 25 | }, 26 | "Ben Myers": { 27 | "github": "bendmyers" 28 | }, 29 | "Brandon Bayer": { 30 | "github": "flybayer" 31 | }, 32 | "Carolyn Stransky": { 33 | "avatar_url": "https://pbs.twimg.com/profile_images/1364910845092847616/Y1sXcsnQ_400x400.jpg" 34 | }, 35 | "Chance Strickland": { 36 | "github": "chaance" 37 | }, 38 | "Chirag": {}, 39 | "Crystal Martin": { 40 | "avatar_url": "https://pbs.twimg.com/profile_images/1400140353542500360/mwezAQN4_400x400.jpg" 41 | }, 42 | "Dan Goodwin": { 43 | "github": "dcgoodwin2112" 44 | }, 45 | "David Ceddia": { 46 | "github": "dceddia" 47 | }, 48 | "Devon": { 49 | "avatar_url": "https://avatars.githubusercontent.com/u/20716219?v=4" 50 | }, 51 | "Duretti Hirpa": { 52 | "github": "duretti" 53 | }, 54 | "Erin Fox": { 55 | "github": "erinfox" 56 | }, 57 | "Faduma Mohammed": { 58 | "avatar_url": "https://pbs.twimg.com/profile_images/1148347824205180928/-Uv8VMro_400x400.png" 59 | }, 60 | "Ferit Topcu": { 61 | "github": "fokusferit" 62 | }, 63 | "Ian Sutherland": { 64 | "github": "iansu" 65 | }, 66 | "Jacob Roman": { 67 | "github": "roman-bytes" 68 | }, 69 | "Jason Lengstorf": { 70 | "github": "jlengstorf" 71 | }, 72 | "Jeff Lembeck": { 73 | "avatar_url": "https://pbs.twimg.com/profile_images/1335774590098817025/FbWZkdQB_400x400.jpg" 74 | }, 75 | "Jenn Creighton": { 76 | "avatar_url": "https://pbs.twimg.com/profile_images/1389295266172489728/JSrSaJWi_400x400.jpg" 77 | }, 78 | "Justin Noel": { 79 | "github": "justinnoel" 80 | }, 81 | "Keith Elliott": { 82 | "github": "keithtelliott" 83 | }, 84 | "Kent C. Dodds": { 85 | "github": "kentcdodds" 86 | }, 87 | "Lauren Tan": { 88 | "github": "poteto" 89 | }, 90 | "Martin Bavio": { 91 | "github": "marbiano" 92 | }, 93 | "Matt Sutkowski": { 94 | "github": "msutkowski" 95 | }, 96 | "Michael Chan": { 97 | "github": "chantastic" 98 | }, 99 | "Michael Gee": { 100 | "github": "michael-gee" 101 | }, 102 | "Michael Jackson": { 103 | "github": "mjackson" 104 | }, 105 | "Paul Jaffre": { 106 | "github": "jaffrepaul" 107 | }, 108 | "Randy Brown": { 109 | "github": "thatrandybrown" 110 | }, 111 | "React": { 112 | "github": "reactjs" 113 | }, 114 | "Robb Schuneman": { 115 | "github": "chalkeater" 116 | }, 117 | "Sandrina Pereira": { 118 | "avatar_url": "https://pbs.twimg.com/profile_images/832718403727196160/hZQGzIVP_400x400.jpg" 119 | }, 120 | "Shaundai Person": { 121 | "github": "shaundai" 122 | }, 123 | "Shruti Kapoor": { 124 | "github": "shrutikapoor08" 125 | }, 126 | "Toby Baratta": { 127 | "github": "tobybaratta" 128 | } 129 | } 130 | -------------------------------------------------------------------------------- /src/schedule/2021-08-26-typescript-in-50-lessons-chapter-2a.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: 'TypeScript in 50 Lessons — Chapter 2a (8, 9, 10)' 3 | type: Club 4 | date: 2021-08-26 17:00:00 5 | speakers: 6 | - Michael Chan 7 | --- 8 | 9 | Join us this week for lessons 8, 9, and 10 of TypeScript in 50 Lessons. Lessons include: 10 | 11 | - Lesson 8: Compiling TypeScript 12 | - Lesson 9: any, Are You OK? 13 | - Lesson 10: Control Flow 14 | 15 | Come with questions concerns, and curiosity! 16 | 17 | This is a short-term community group for owners of the book TypeScript in 50 Lessons. The only requirement is that you own the book. 18 | 19 | - [Amazaon — Kindle-only](https://amzn.to/3lr3ahA) (affiliate link) 20 | - [Smashing Magazine — all formats](https://typescript-book.com) 21 | 22 | ## Notes 23 | 24 | ### Terms 25 | 26 | - type annotation, p71 27 | - top type, p73 28 | - emit, p76 29 | - any, p76 30 | - left-hand typing, p78 31 | - right-hand typing, p78 32 | - fixed-point, p83 33 | - type guards, p84 34 | - control flow analysis, p84 35 | - narrowing down, p84 36 | - subtypes, p86 37 | - supertypes, p86 38 | - unknown, p87 39 | 40 | ### High-level takeaways 41 | 42 | - `any` is regular JavaScript 43 | - You'll see inference-based warnings 44 | - But these warnings are based exclusively on context, not intent 45 | - `unkown` will require type narrowing depending on types used (return type, or methods used on variable) 46 | 47 | ```ts 48 | // example of unkown, function parameter types, return types, nad type narrowing with type guards 49 | function selectDeliveryAddress(addressOrIndex: unkown): string { 50 | if(typeof addressOrIndex === 'number' && addressOrIndex < deliveryAddresses.length) { 51 | return deliveryAddrress[addressOrIndex]; 52 | } 53 | 54 | if(typeof addressOrIndex === 'string') { 55 | return addressOrIndex; 56 | } 57 | 58 | return ''; 59 | } 60 | ``` 61 | 62 | ### Discussion 63 | 64 | - MC: Love the author's transition here. TS is JS w/implicit `any` (top type). Then from implicit `any` to `unkown`, which actually helps you write proper guards 65 | - DG: This is a mental model shift — seeing TS as progressive JS-tooling over a strongly typed language 66 | - MC: Everything in JS is `any` because JS doesn't restrict the calling of methods ever. `unkown` is the unlock for real-time type checking (type narrowing) 67 | - TWM: It's nice that the TS types don't attempt to modify JS. But types like `any` and `unkown` accept JS for what it is 68 | - DG: Right-hand typing is interesting, coming left-hand typing. 69 | - FT: If you don't have `any` types — and TS does not have to perform type inference — does `tsc` compile faster? 70 | - MC: 71 | - FT: `any` consistently shows up in tutorials a but rarely `unknown`. Why? 72 | - MC: `unknown` is like a pair programmer in defensive programming 73 | - TWM: What is unknown for? Feels like a good fit for external code, maybe second and third-party integration, etc. 74 | - MC/FT: TypeScript is empathetic 75 | - TWM: I dismissed TS for so long because of the "TS makes JS is a real language now" sentiment 76 | - DG: The real world is messy. there will always be exceptions 77 | - MC: I learned early on in my experience as a frontend architect that there will always be exceptions and unmigrated code. So many people think they have a solution that requires *only* that everyone else change. The most useful tools create a bridge from the present to the future. 78 | - FT: Who didn't we like TS earlier? 79 | - MC: Progressive typing wasn't a reality until Flow emerged 80 | - TWM: We use types presence to evaluate library quality. Types can signify intent and/or community commitment 81 | -------------------------------------------------------------------------------- /cli/index.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs'); 2 | const inquirer = require('inquirer'); 3 | const chalk = require('chalk'); 4 | const emoji = require('node-emoji'); 5 | 6 | const { EVENT_TYPES, printEmojiRibbon } = require('../utils'); 7 | 8 | const welcomePhrase = `Welcome to the Lunch.Dev Community Calendar Event Generator!`; 9 | const pizzaCount = welcomePhrase.length / 2 + 3; 10 | 11 | console.log( 12 | emoji.emojify(chalk` 13 | ${printEmojiRibbon('pizza', pizzaCount)} 14 | 15 | {green.bold :pizza: ${welcomePhrase} :pizza:} 16 | 17 | ${printEmojiRibbon('pizza', pizzaCount)} 18 | 19 | {yellow Let's do awesome stuff} 20 | 21 | `) 22 | ); 23 | 24 | const questions = [ 25 | { 26 | type: 'input', 27 | name: 'title', 28 | message: "What's the name of this event?", 29 | validate: function (value) { 30 | const valid = value.length > 5; 31 | 32 | return valid || `It's probably a good idea to have descriptive title with more than 5 characters... maybe?`; 33 | }, 34 | }, 35 | { 36 | type: 'list', 37 | name: 'event_type', 38 | message: 'What kind of event is this?', 39 | choices: EVENT_TYPES, 40 | }, 41 | { 42 | type: 'input', 43 | name: 'date', 44 | message: 'What is the date of the event? (format: YYYY/MM/DD)', 45 | validate: function (value) { 46 | // Naive validation - please don't pass bad dates... I'm so bad at regex :( 47 | const valid = value.match(/^(\d{4})\/(\d{1,2})\/(\d{1,2})$/g); 48 | 49 | return !!valid || 'Please enter a date in a format like: 2030/01/31'; 50 | }, 51 | }, 52 | { 53 | type: 'input', 54 | name: 'time', 55 | message: 'What time (in UTC) hh or hh:mm (10 or 10:30)?', 56 | validate: function (value) { 57 | const valid = value.match(/^([0-9]{2}$|[0-9]{2}\:[0-9]{2})/); 58 | 59 | return !!valid || 'Gimmie a time like 10 or 10:30'; 60 | }, 61 | }, 62 | ]; 63 | 64 | inquirer.prompt(questions).then((args) => { 65 | const { date, title, event_type, timezone, time } = args; 66 | 67 | const [year, month, day] = date.split('/'); 68 | 69 | const fileName = `${year}-${month}-${day}-${title 70 | .toLowerCase() 71 | .replace(/[^\w\s]/g, '') 72 | .split(' ') 73 | .join('-')}`; 74 | 75 | let outputFile = `./src/schedule/${fileName}.md`; 76 | 77 | // Just some bad handling for existing files. Someone should help out here :) 78 | if (fs.existsSync(outputFile)) { 79 | const bananaParty = [...new Array(18)].map((_) => emoji.get('banana')).join(''); 80 | 81 | console.log(chalk` 82 | ${bananaParty} 83 | 84 | {red.bold This is crazy... 85 | 86 | but {underline ${outputFile}} already exists... 87 | 88 | so we're slightly modifying the output} 89 | 90 | ${bananaParty} 91 | `); 92 | // This is just for comedy. I'm hoping someone wants to do a better job of this and handle it in the prompts 93 | outputFile = `${outputFile.replace('.md', '-bananas.md')}`; 94 | } 95 | 96 | // Naive template alert! We could always use nunjucks or another engine and make this more funner if you want prepopulated formats based on the event_type 97 | const renderTemplate = (ctx) => `\ 98 | --- 99 | title: "${ctx.title}" 100 | type: ${ctx.event_type} 101 | date: ${ctx.date} 102 | --- 103 | 104 | `; 105 | 106 | const [hours, minutes = '00'] = time.split(':'); 107 | const utcStr = `${year}-${month}-${day} ${hours}:${minutes}:00`; 108 | 109 | const ctx = { 110 | title, 111 | event_type, 112 | date: utcStr, 113 | }; 114 | 115 | fs.writeFileSync(outputFile, renderTemplate(ctx)); 116 | 117 | console.log(chalk` 118 | ${printEmojiRibbon('clap')} 119 | {bold.red CONGRATS, YADIDDIT!} 120 | ${printEmojiRibbon('clap')} 121 | 122 | Now, add some awesome details to it: ${outputFile} 123 | 124 | `); 125 | }); 126 | -------------------------------------------------------------------------------- /src/_includes/partials/footer.html: -------------------------------------------------------------------------------- 1 | 65 | -------------------------------------------------------------------------------- /src/sesh.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Using Sesh to Plan Events 3 | layout: layouts/page.html 4 | --- 5 | 6 | Lately, we've been trying out a Discord bot called [Sesh](https://sesh.fyi), which helps us get RSVPs for events and send out reminders — independent of your timezone. Currently, Sesh events are set up in our **#live-event-text** channel, though that's subject to change. 7 | 8 | ## RSVPing to Sesh Events 9 | 10 | An event is going to happen, and you'd like to take part! Welcome! We're happy to have you! 11 | 12 | Whenever someone sets up an event, Sesh posts a big message that looks something like this: 13 | 14 | ![Discord message from the Sesh bot. The message describes an event called Sample Event, which takes place on Wednesday, Jan 13 at 4pm CST. The message has three reactions: a checkmark, a clock, and a notepad with a pencil.](/assets/sesh-screenshot.png) 15 | 16 | Sesh reacts to its own message with three emojis: ✅, 🕐, and 📝. **You can click these reactions to RSVP or to get a personalized timezone conversion.** 17 | 18 | - **✅:** Click this reaction to **provide your RSVP** for the event. Sesh will privately message you to set up (optional) reminders for the event. If the event organizer changes any details, Sesh will notify you. If you want to unRSVP, click the ✅ emote again. 19 | 20 | - **🕐:** When you click this reaction, Sesh will privately message you the event's time in **your personal timezone.** This requires you to set up your timezone with Sesh — the bot will walk you through setting your timezone in your direct messages. 21 | 22 | - **📝:** Click this reaction to **edit your event.** You can only do this if you created the event, or if you're a server admin. 23 | 24 | ## Creating and Managing Sesh Events 25 | 26 | So you'd like to organize an event! That's great! Once you've figured out when it should happen, you should create a Sesh event so others can start RSVPing! 27 | 28 | To create a Sesh event, you'll want to go to **#live-event-text** or whichever channel is the most appropriate and use the `!create` command. Here are a few examples of `!create` commands you could use: 29 | 30 | - `!create React Podcast Listening Party on January 27 at 12pm PST` 31 | - `!create Rust Book Club on Wednesday at 7pm` 32 | - `!create Building an Eleventy Community Calendar tomorrow 11am to 12:30pm` 33 | 34 | There are probably other things you could do — the natural language processing on these commands seems pretty intuitive. 35 | 36 | 40 | 41 | If you've created an event that you'd now like to **modify or delete**, click the 📝 reaction on Sesh's message. Sesh will privately message you something that looks like this: 42 | 43 | ![Discord message from the Sesh bot. The header reads 'Edit Event Sample Event'. It's followed by a link which reads 'Click here to edit this event.' The message has two reactions: a wastebasket and a checkmark.](/assets/sesh-edit.png) 44 | 45 | To edit the event, click the provided link. To delete the event, react to Sesh's message with both the wastebasket and the checkmark emojis that Sesh has provided. 46 | 47 | ### `#sesh` url fragment 48 | 49 | Event urls have a hidden section with pre-filled command for creating a sesh event in Discord. Append `#sesh` to an event url to make it visible. 50 | 51 | ![Sample hidden command section in event page. The label reads 'Paste this sesh command into a Discord channel to create a joinable event:'. The sample command reads '!create Some Antics: Getting Started with Automated Accessibility Testing, with Lucia Cerchie on May 18, 2021 10:00 AM PST for 1 hour'.](/assets/sesh-url.png) 52 | 53 | ## I need a bit more information! 54 | 55 | You can find Sesh's full list of commands at [sesh.fyi/manual](https://sesh.fyi/manual/). Most of these commands require server admin privileges, however. 56 | -------------------------------------------------------------------------------- /src/_includes/layouts/homepage.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {% include partials/favicon.html %} 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 18 | Lunch.dev Community Calendar 19 | 20 | {% include partials/analytics.html %} 21 | 22 | 23 | {% include partials/header.html %} 24 |
25 |

Next event

26 |
27 | {% assign nextEvent = collections.upcomingEvents | first %} 28 |
29 |

{{ nextEvent.data.title }}

30 | 31 |

32 | {% if nextEvent.data.type %}{{ nextEvent.data.type }} · {% endif %} 33 | 34 |

35 | 36 |
    42 | {% for speaker in nextEvent.data.speakerDetails %} 43 |
  • 44 | {{ speaker.name }} 45 |
    • 46 | {% endfor %} 47 |
48 | 49 | {% assign nextEventUrl = nextEvent.url %} {% if nextEvent.data.url %} {% assign nextEventUrl = 50 | nextEvent.data.url %} {% endif %} 51 | 52 | View Details › 53 | 54 |
55 |
56 | 57 |

Upcoming Events

58 |
59 | {% assign upcomingEvents = collections.upcomingEvents | slice: 1, collections.upcomingEvents.length %} {% for 60 | event in upcomingEvents %} 61 |
62 |

{{ event.data.title }}

63 | 64 |

65 | {% if event.data.type %}{{ event.data.type }} · {% endif %} 66 | 67 |

68 | 69 |
    75 | {% for speaker in event.data.speakerDetails %} 76 |
  • 77 | {{speaker.name}} 78 |
    • 79 | {% endfor %} 80 |
81 | 82 | {% assign eventUrl = event.url %} {% if event.data.url %} {% assign eventUrl = event.data.url %} {% endif %} 83 | View Details › 84 |
85 | {% endfor %} 86 |
87 | 88 |

Past Events

89 |
90 | {% for event in collections.pastEvents reversed %} 91 |
92 |

{{ event.data.title }}

93 |

94 | {% if event.data.type %}{{ event.data.type }} · {% endif %} 95 | 96 |

97 | 98 |
    104 | {% for speaker in event.data.speakerDetails %} 105 |
  • 106 | {{speaker.name}} 107 |
    • 108 | {% endfor %} 109 |
110 | 111 | View Details › 112 |
113 | {% endfor %} 114 |
115 |
116 | {% include partials/footer.html %} 117 | 118 | 119 | -------------------------------------------------------------------------------- /.all-contributorsrc: -------------------------------------------------------------------------------- 1 | { 2 | "files": [ 3 | "README.md" 4 | ], 5 | "imageSize": 100, 6 | "commit": false, 7 | "contributors": [ 8 | { 9 | "login": "msutkowski", 10 | "name": "Matt Sutkowski", 11 | "avatar_url": "https://avatars.githubusercontent.com/u/784953?v=4", 12 | "profile": "https://github.com/msutkowski", 13 | "contributions": [ 14 | "code", 15 | "tool" 16 | ] 17 | }, 18 | { 19 | "login": "chantastic", 20 | "name": "Michael Chan", 21 | "avatar_url": "https://avatars.githubusercontent.com/u/658360?v=4", 22 | "profile": "http://twitter.com/chantastic", 23 | "contributions": [ 24 | "code", 25 | "content", 26 | "eventOrganizing", 27 | "projectManagement", 28 | "video" 29 | ] 30 | }, 31 | { 32 | "login": "BenDMyers", 33 | "name": "Ben Myers", 34 | "avatar_url": "https://avatars.githubusercontent.com/u/18060369?v=4", 35 | "profile": "https://github.com/BenDMyers", 36 | "contributions": [ 37 | "a11y", 38 | "code", 39 | "content", 40 | "eventOrganizing", 41 | "projectManagement" 42 | ] 43 | }, 44 | { 45 | "login": "michael-gee", 46 | "name": "Michael Gee", 47 | "avatar_url": "https://avatars.githubusercontent.com/u/17189731?v=4", 48 | "profile": "http://michaelgee.com", 49 | "contributions": [ 50 | "a11y", 51 | "code", 52 | "design", 53 | "content", 54 | "eventOrganizing" 55 | ] 56 | }, 57 | { 58 | "login": "Kirill-frontend", 59 | "name": "Kirill-frontend", 60 | "avatar_url": "https://avatars.githubusercontent.com/u/69352064?v=4", 61 | "profile": "https://github.com/Kirill-frontend", 62 | "contributions": [ 63 | "code" 64 | ] 65 | }, 66 | { 67 | "login": "roman-bytes", 68 | "name": "Jacob Roman", 69 | "avatar_url": "https://avatars.githubusercontent.com/u/4601329?v=4", 70 | "profile": "https://romanbytes.dev/", 71 | "contributions": [ 72 | "code", 73 | "eventOrganizing", 74 | "content" 75 | ] 76 | }, 77 | { 78 | "login": "aditya28sarin", 79 | "name": "Aditya Sarin", 80 | "avatar_url": "https://avatars.githubusercontent.com/u/48805315?v=4", 81 | "profile": "https://thetechnomaniac.com", 82 | "contributions": [ 83 | "code" 84 | ] 85 | }, 86 | { 87 | "login": "chalkeater", 88 | "name": "chalkeater", 89 | "avatar_url": "https://avatars.githubusercontent.com/u/900767?v=4", 90 | "profile": "https://github.com/chalkeater", 91 | "contributions": [ 92 | "eventOrganizing" 93 | ] 94 | }, 95 | { 96 | "login": "ajcwebdev", 97 | "name": "Anthony Campolo", 98 | "avatar_url": "https://avatars.githubusercontent.com/u/12433465?v=4", 99 | "profile": "http://dev.to/ajcwebdev", 100 | "contributions": [ 101 | "content", 102 | "eventOrganizing" 103 | ] 104 | }, 105 | { 106 | "login": "jaffrepaul", 107 | "name": "Paul", 108 | "avatar_url": "https://avatars.githubusercontent.com/u/6298501?v=4", 109 | "profile": "https://github.com/jaffrepaul", 110 | "contributions": [ 111 | "content", 112 | "eventOrganizing" 113 | ] 114 | }, 115 | { 116 | "login": "keithtelliott", 117 | "name": "keithtelliott", 118 | "avatar_url": "https://avatars.githubusercontent.com/u/43206213?v=4", 119 | "profile": "https://github.com/keithtelliott", 120 | "contributions": [ 121 | "content", 122 | "eventOrganizing" 123 | ] 124 | }, 125 | { 126 | "login": "mjackson", 127 | "name": "Michael Jackson", 128 | "avatar_url": "https://avatars.githubusercontent.com/u/92839?v=4", 129 | "profile": "https://mjackson.me", 130 | "contributions": [ 131 | "eventOrganizing" 132 | ] 133 | }, 134 | { 135 | "login": "alexanderson1993", 136 | "name": "Alex", 137 | "avatar_url": "https://avatars.githubusercontent.com/u/6558157?v=4", 138 | "profile": "https://ralexanderson.com", 139 | "contributions": [ 140 | "eventOrganizing" 141 | ] 142 | }, 143 | { 144 | "login": "fokusferit", 145 | "name": "Ferit Topcu", 146 | "avatar_url": "https://avatars.githubusercontent.com/u/1215719?v=4", 147 | "profile": "http://www.ftopcu.de", 148 | "contributions": [ 149 | "bug" 150 | ] 151 | }, 152 | { 153 | "login": "DalisaNguyen", 154 | "name": "DalisaNguyen", 155 | "avatar_url": "https://avatars.githubusercontent.com/u/44213341?v=4", 156 | "profile": "https://github.com/DalisaNguyen", 157 | "contributions": [ 158 | "code", 159 | "design" 160 | ] 161 | }, 162 | { 163 | "login": "Jarvis1010", 164 | "name": "Travis Waith-Mair", 165 | "avatar_url": "https://avatars.githubusercontent.com/u/5460770?v=4", 166 | "profile": "https://non-traditional.dev", 167 | "contributions": [ 168 | "content", 169 | "eventOrganizing" 170 | ] 171 | } 172 | ], 173 | "contributorsSortAlphabetically": true, 174 | "contributorsPerLine": 7, 175 | "projectName": "community-calendar", 176 | "projectOwner": "LunchDevCommunity", 177 | "repoType": "github", 178 | "repoHost": "https://github.com", 179 | "skipCi": true, 180 | "commitConvention": "none" 181 | } 182 | -------------------------------------------------------------------------------- /src/_includes/layouts/event.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {% include partials/favicon.html %} 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 18 | {{ title }}{% if type %}, {{type}}{% endif %} | Lunch.dev Community Calendar 19 | 20 | 21 | 25 | 26 | 30 | 31 | 32 | 33 | {% include partials/analytics.html %} 34 | 35 | 36 | {% include partials/header.html %} 37 |
38 |
39 |

{{ title }}

40 | 41 | {% if speakers %} {{ speakers | join: ', ' }} · {% endif %} 42 | 43 | 44 | 45 | {% if calendarLinks.isPastEvent %} 46 |
{% include partials/calendarLinks.html %}{% include partials/join-discord-button.html %}
47 | {% endif %} {{ content }} {% case speakers.size %} {% when undefined %} {% when 1 %} 48 |

Speaker

49 | {% else %} 50 |

Speakers

51 | {% endcase %} 52 | 53 |
    54 | {% for speaker in speakers %} 55 |
  • 61 | 62 | {{speaker}} 63 |
    • 64 | {% endfor %} 65 |
66 |

67 | 68 | 81 | Join us in Discord 82 | 83 |
84 | 85 | 98 | 99 | Improve this page on GitHub 100 | 101 | 102 |

103 |
104 | {% include partials/event-sesh-command.html %} 105 |
106 | {% include partials/footer.html %} 107 | 108 | 109 | -------------------------------------------------------------------------------- /src/code-of-conduct.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Code of Conduct 3 | layout: layouts/page.html 4 | --- 5 | 6 | ## Our Goal 7 | 8 | This community is dedicated to providing a harassment-free experience for everyone. We do not tolerate harassment of participants in any form. 9 | 10 | ## Applicability and Scope 11 | 12 | This code of conduct applies to all of this community's spaces, including public channels, private channels and direct messages, both online and off. Anyone who violates this code of conduct may be sanctioned or expelled from these spaces at the discretion of the administrators. 13 | 14 | ## Toward a Welcoming and Safe Environment 15 | 16 | We hope to create an environment in which diverse individuals can collaborate and interact in a positive and affirming way. Examples of behavior that contributes to creating this sort of environment include: 17 | 18 | - Using welcoming and inclusive language 19 | - Being respectful of differing viewpoints and experiences 20 | - Gracefully accepting constructive criticism 21 | - Focusing on what is best for the overall community 22 | - Showing empathy towards other community members 23 | 24 | ## Anti-Harassment Statement 25 | 26 | This community will not tolerate harassment of any kind. Examples of harassment include: 27 | 28 | - Offensive comments related to gender, gender identity and expression, sexual orientation, disability, mental illness, neuro(a)typicality, physical appearance, pregnancy status, veteran status, political affiliation, marital status, body size, age, race, national origin, ethnic origin, nationality, immigration status, language, religion or lack thereof, or other identity marker. This includes anti-Indigenous/Nativeness and anti-Blackness. 29 | - Unwelcome comments regarding a person's lifestyle choices and practices, including those related to food, health, parenting, relationships, drugs, and employment. 30 | - Deliberate misgendering, using inappropriate pronouns, or use of "dead" or rejected names. 31 | - Gratuitous or off-topic sexual images or behavior in spaces where they're not appropriate. 32 | - Physical contact and simulated physical contact (eg, textual descriptions like "hug" or "backrub") without consent or after a request to stop. 33 | - Threats of violence. 34 | - Incitement of violence towards any individual or group, including encouraging a person to commit suicide or to engage in self-harm. 35 | - Deliberate intimidation. 36 | - Stalking or following - online or in the physical world. 37 | - Harassing photography or recording, including logging online activity for harassment purposes. 38 | - Sustained disruption of discussion. 39 | - Unwelcome sexual attention. 40 | - Patterns of inappropriate social contact, such as requesting/assuming inappropriate levels of intimacy with others. 41 | - Continued one-on-one communication after requests to cease. 42 | - Deliberate "outing" of any aspect of a person's identity without their consent except as necessary to protect vulnerable people from intentional abuse. 43 | - Publication of non-harassing private communication. 44 | - Jokes that resemble the above, such as "hipster racism", still count as harassment even if meant satirically or ironically. 45 | 46 | If you have questions or concerns about these issues please feel free to message an admin or ask for an opportunity to explore the issue with a moderator and volunteers. 47 | 48 | ## Reporting 49 | 50 | If you are being harassed by a member of our community, notice that someone else is being harassed, or have any other concerns, please contact the administrators via `hi@chan.dev` or `@moderators` Discord role. If the person who is harassing you is on the admin team, they will not be involved in handling or resolving the incident. 51 | 52 | The admin team will respond to any complaint as promptly as possible we can. If you do not get a timely response (for example, if no admins are currently online) then please put your personal safety and well-being first, and consider logging out and/or contacting the admins by email at `hi@chan.dev`. 53 | 54 | This code of conduct applies to our community's spaces, but if you are being harassed by a member of our community outside our spaces, we still want to know about it. We will take all good-faith reports of harassment by our members, especially the administrators, seriously. This includes harassment outside our spaces and harassment that took place at any point in time. The abuse team reserves the right to exclude people from the community based on their past behavior, including behavior outside of our spaces and behavior towards people who are not in this community. 55 | 56 | In order to protect volunteers from abuse and burnout, we reserve the right to reject any report we believe to have been made in bad faith. Reports intended to silence legitimate criticism may be deleted without response. 57 | 58 | ## Enforcement Process 59 | 60 | Every code of conduct violation report will be treated with seriousness and care. If a member's immediate safety and security is threatened, an individual admin may take any action that they deem appropriate, up to and including temporarily banning the offender from the community. In less urgent situations, at least two admins will discuss the offense and mutually arrive at a suitable response, which will be shared with the offender privately. Whatever the resolution that they decide upon, the decision of the admins involved in a violation case will be considered final. 61 | 62 | We will respect confidentiality requests for the purpose of protecting victims of abuse. At our discretion, we may publicly name a person about whom we've received harassment complaints, or privately warn third parties about them, if we believe that doing so will increase the safety of our members or the general public. We will not name harassment victims without their affirmative consent. 63 | 64 | ## Consequences 65 | 66 | Participants asked to stop any harassing behavior are expected to comply immediately. If a participant engages in harassing behavior, the administrators may take any action they deem appropriate, up to and including expulsion from the community and identification of the participant as a harasser to other members. At the discretion of the admins, or by request, one or more of the parties involved may request to discuss the violation and how to avoid similar situations in the future. 67 | 68 | ## Acknowledgements 69 | 70 | This Code of Conduct is adapted from the Community Covenant (http://community-covenant.net), version 1.0, available at http://community-covenant.net/version/1/0/. The Community Covenant is an open source effort and is built on codes of conduct that came before it, including the Contributor Covenant (http://contributor-covenant.org/) and the LGBTQ in Tech community code of conduct (http://lgbtq.technology/coc.html). 71 | 72 | ## License 73 | 74 | Community Covenant by Coraline Ada Ehmke is licensed under a Creative Commons Attribution 4.0 International License (http://creativecommons.org/licenses/by/4.0/). Based on a work at http://community-covenant.net/. 75 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # 📅 Lunch.dev Community Calendar 2 | 3 | 4 | 5 | [![All Contributors](https://img.shields.io/badge/all_contributors-16-orange.svg?style=flat-square)](#contributors-) 6 | 7 | 8 | 9 | Welcome to the **Lunch.dev Community Calendar**! This site shows off all of the cool things we've been doing in our [Discord community](https://discord.gg/lunchdev). It's built with a static site generator called [Eleventy](https://11ty.dev). 10 | 11 | ## Sounds great! How do I run it? 12 | 13 | First off, you'll want to clone it and install your dependencies. 14 | 15 | ```bash 16 | git clone https://github.com/LunchDevCommunity/community-calendar.git 17 | cd community-calendar 18 | npm install 19 | ``` 20 | 21 | Then, you'll want to decide whether you want to create a **one-off build** or spin up a **dev server** that updates whenever you make a change **(you probably want the dev server)**. 22 | 23 | **One-off build:** 24 | 25 | ```bash 26 | npm run build 27 | ``` 28 | 29 | **Dev server:** 30 | 31 | ``` 32 | npm run dev 33 | ``` 34 | 35 | Then navigate to [localhost:8080](http://localhost:8080) to see the site. 36 | 37 | ## Can I contribute? 38 | 39 | Absolutely! We're using this community calendar as a way to learn these tools together, and that means open-sourcing it! We'll have more contribution information later, but in the meantime, if you have an idea for improvements, reach out [on the server](https://https://events.lunch.dev/discord). 40 | 41 | ## Contributors ✨ 42 | 43 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 |

Aditya Sarin
💻
Alex
📋
Anthony Campolo
🖋 📋
Ben Myers
️️️️♿️ 💻 🖋 📋 📆
DalisaNguyen
💻 🎨
Ferit Topcu
🐛
Jacob Roman
💻 📋 🖋

Kirill-frontend
💻
Matt Sutkowski
💻 🔧
Michael Chan
💻 🖋 📋 📆 📹
Michael Gee
️️️️♿️ 💻 🎨 🖋 📋
Michael Jackson
📋
Paul
🖋 📋
Travis Waith-Mair
🖋 📋

chalkeater
📋
keithtelliott
🖋 📋
72 | 73 | 74 | 75 | 76 | 77 | 78 | This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! 79 | -------------------------------------------------------------------------------- /src/assets/favicon/safari-pinned-tab.svg: -------------------------------------------------------------------------------- 1 | 2 | 4 | 7 | 8 | Created by potrace 1.14, written by Peter Selinger 2001-2017 9 | 10 | 12 | 115 | 119 | 120 | 121 | --------------------------------------------------------------------------------