diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml new file mode 100644 index 0000000..c03add5 --- /dev/null +++ b/.github/workflows/lint.yml @@ -0,0 +1,37 @@ +# This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node +# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs + +name: Node.js CI + +on: + push: + branches: [ "master" ] + pull_request: + branches: [ "master" ] + +jobs: + build: + runs-on: ubuntu-latest + + strategy: + matrix: + node-version: [18.x, 20.x] + + steps: + - name: Checkout repository + uses: actions/checkout@v3 + + - name: Use Node.js ${{ matrix.node-version }} + uses: actions/setup-node@v3 + with: + node-version: ${{ matrix.node-version }} + cache: 'yarn' + + - name: Install dependencies + run: yarn + + - name: Build + run: yarn build + + - name: Run linter + run: yarn lint diff --git a/presentation/console.js b/presentation/console.js index 0974978..a494353 100644 --- a/presentation/console.js +++ b/presentation/console.js @@ -4,17 +4,11 @@ import { Box, CodePane, Deck, - FlexBox, - FullScreen, Heading, Image, - ListItem, Notes, - Progress, - Quote, Slide, Text, - UnorderedList, } from "spectacle"; const images = { @@ -33,8 +27,8 @@ const images = { const Presentation = () => ( - Using Chrome's console - It's not just console.log anymore + Using Chrome's console + It's not just console.log anymore Created by Doug Wade / @dougwade @@ -170,7 +164,7 @@ console.dir(characters[3]); console.table(characters);`} - Here's code with dates to show dates + Here's code with dates to show dates {` console.dir({ name: 'Archer', age: 37, aliases: ['Duchess', 'Randy'], created: new Date() }); `} diff --git a/presentation/meet-react-server.js b/presentation/meet-react-server.js index 0594e6b..71394da 100644 --- a/presentation/meet-react-server.js +++ b/presentation/meet-react-server.js @@ -4,14 +4,11 @@ import { Box, CodePane, Deck, - FlexBox, - FullScreen, Heading, Image, ListItem, UnorderedList, Notes, - Progress, Slide, Text } from "spectacle"; @@ -40,27 +37,27 @@ const Presentation = () => ( Thank Max Stoiber for the intro to css Express excitement to be in Amsterdam - Going to talk about my favorite FOSS project, though we'll see after James Kyle's talk ;) + Going to talk about my favorite FOSS project, though we'll see after James Kyle's talk ;) - What's wrong? + What's wrong? Javascript Fatigue There are too many tools, and they change too often. - The tooling is complicated to set up, and inaccessible for "joe and jane developer". + The tooling is complicated to set up, and inaccessible for "joe and jane developer". it took us many months/tries/mistakes to get a universal react app working well. - What's wrong? + What's wrong? Slow Internet Credit/Source: ITU ICT Facts and Figures 2016 @@ -70,14 +67,14 @@ const Presentation = () => ( From the The International Telecommunication Union, a branch of the UN Most internet users are on mobile. Most internet users are not in the first world. - Most internet users don't have the patience to wait while your 4 MB bundle downloads + Most internet users don't have the patience to wait while your 4 MB bundle downloads (47% of consumers expect a web page to load in 2 seconds or less). - What's wrong? + What's wrong? No Javascript @@ -85,7 +82,7 @@ const Presentation = () => ( Primarily an SEO problem. Some users blocking because of ads or security. - Has the added benefit of maintaining the "document" nature of the web + Has the added benefit of maintaining the "document" nature of the web @@ -101,7 +98,7 @@ const Presentation = () => ( - They're p similar: they all come with a babel preset, + They're p similar: they all come with a babel preset, webpack configuration @@ -193,8 +190,8 @@ const Presentation = () => ( Address impatient users by getting chunks on the page as soon as possible - Prevent users from clicking on the wrong element when the page "jumps" (Dark Pattern) - Treat the page like a document that "snaps in" as soon as it is ready + Prevent users from clicking on the wrong element when the page "jumps" (Dark Pattern) + Treat the page like a document that "snaps in" as soon as it is ready The page becomes interactive as soon as above-the-fold content is loaded but no sooner @@ -208,7 +205,7 @@ const Presentation = () => ( Send a bundle of data + code that was used for server rendering so the DOM render the same. - client-side rendering "prequests" that the server ready a data bundle and hold it until the request + client-side rendering "prequests" that the server ready a data bundle and hold it until the request @@ -280,7 +277,7 @@ export default class ExamplePage { Lifecycle methods are specially named methods that React Server calls as part of the page lifecycle - React Server provides "best-guess" defaults for all lifecycle methods + React Server provides "best-guess" defaults for all lifecycle methods This example adds meta tags and a title to the page head @@ -340,7 +337,7 @@ export default class ExamplePage { External synchronous js file can significantly impact perf by blocking - devs define css + js in a structured way so they can't tank perf + devs define css + js in a structured way so they can't tank perf prepares us for http2 by creating a manifest of js + css to push body classes allow you to add classes to the generated body tag @@ -482,7 +479,7 @@ navigator.on("loadComplete", onLoadComplete);`} - What's next? + What's next? Webpack (and hmr!) on the server Clustering diff --git a/presentation/python-at-redfin.js b/presentation/python-at-redfin.js index 37f8435..0fa364e 100644 --- a/presentation/python-at-redfin.js +++ b/presentation/python-at-redfin.js @@ -48,8 +48,8 @@ const Presentation = () => ( Platforms team - I'm mostly a javascriptista, but Python was the first language I liked - I've been at Redfin almost a year + I'm mostly a javascriptista, but Python was the first language I liked + I've been at Redfin almost a year I work mostly on front end build, especially performance @@ -71,7 +71,7 @@ const Presentation = () => ( walk score deployments - These are smaller uses; just emphasizing Python's ubiquity + These are smaller uses; just emphasizing Python's ubiquity Our nagios alerts are a subset used to monitor Jenkins Our test team uses python to run performance tests against the site The data team uses python for listings imports, photos @@ -89,7 +89,7 @@ const Presentation = () => ( - We're currently working on creating a continuous deployment pipeline + We're currently working on creating a continuous deployment pipeline Many parts of the are written in Python Our Python is rapidly growing @@ -112,7 +112,7 @@ const Presentation = () => ( Written at Google, uses hermeticism to guarantee reproducability, and a distributed artifact cache for performance This is a big part of our move to continuous deployment, to get builds under 6 minutes - We've struggled with our module builds because of npm violations of bazel assumptions + We've struggled with our module builds because of npm violations of bazel assumptions @@ -155,7 +155,7 @@ external_npm_module = rule( Used almost exclusively for deployments Is managed by a Google doc that is translated to xml and then updates the google doc with timing data - Manage everything except a small subset of ops boxes that aren't deployed to + Manage everything except a small subset of ops boxes that aren't deployed to @@ -297,7 +297,7 @@ $ pip install https://github.com/redfin/dirpy/zipball/master`} - We're Hiring! + We're Hiring! Jobs site Contact us: techrecruiting@redfin.com @@ -305,11 +305,11 @@ $ pip install https://github.com/redfin/dirpy/zipball/master`} Questions? - This couldn't possibly work, could it? It can't be that easy, can it? But it works! - Dan Fabulich + This couldn't possibly work, could it? It can't be that easy, can it? But it works! - Dan Fabulich - Mostly, our experience in Python has been: it shouldn't be this easy, but it is - Dan / jlo's story about starting a thread / process pool + Mostly, our experience in Python has been: it shouldn't be this easy, but it is + Dan / jlo's story about starting a thread / process pool diff --git a/presentation/walk-score-api.js b/presentation/walk-score-api.js index 00227d2..660901f 100644 --- a/presentation/walk-score-api.js +++ b/presentation/walk-score-api.js @@ -4,14 +4,10 @@ import { Box, CodePane, Deck, - FlexBox, - FullScreen, Heading, Image, ListItem, OrderedList, - Progress, - Quote, Slide, Text, UnorderedList, @@ -274,7 +270,7 @@ router.get('/api/stop/:id', function *() { "distance": 0.0437115618187228 , "name": "1ST AVE & LENORA ST" , "summary_text": "1ST AVE & LENORA ST (0.0 mi)\t99, 121" - , "summary_html": "1ST AVE & LENORA ST (0.0 mi) 99, 121" + , "summary_html": "1ST AVE & LENORA ST (0.0 mi) 99, 121" , "route_summary": [ { "category": "Bus" @@ -372,8 +368,8 @@ function getRoute() { {` function linestringToCoordinates(linestring) { return linestring - .replace(/LINESTRING\(/i, '') - .replace(/\)/i, '') + .replace(/LINESTRING(/i, '') + .replace(/)/i, '') .split(',') .map(function(coord) { var parts = coord.split(' ');