next-mdx-remote v4 (#737)

2025-11-02 16:14:03 -05:00 · 2022-01-18 09:25:09 -05:00
parent 2ef5d06c38
commit a406010bd2
110 changed files with 1009 additions and 1490 deletions
--- a/notes/bernie-sanders-bern-app-data.mdx
+++ b/notes/bernie-sanders-bern-app-data.mdx
@@ -11,14 +11,10 @@ tags:
 image: "/static/images/notes/bernie-sanders-bern-app-data/sad-bernie.jpg"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-import Video from "../components/media/Video";
-
 The team behind Bernie Sanders' 2020 campaign [released a new web app](https://www.nbcnews.com/politics/2020-election/bernie-sanders-2020-campaign-unveils-app-increase-its-voter-database-n999206) last month named [BERN](https://app.berniesanders.com/). The goal of BERN is simple: to gather as much information as they can on as many voters in the United States as they can, and make their grassroots army of enthusiastic supporters do the work. It's undoubtedly a smart strategy, but also a concerning one for myself and other privacy advocates.

 <Image
-  src="/static/images/notes/bernie-sanders-bern-app-data/sad-bernie.jpg"
+  src="/public/static/images/notes/bernie-sanders-bern-app-data/sad-bernie.jpg"
  width="865"
  height="433"
  alt="Sad Bernie"
@@ -51,34 +47,32 @@ Using either feature, a volunteer starts with a search of the database for the v
 Here's one of the instructional videos provided internally to volunteers:

 <Video
-  url={[
-    { src: "/static/images/notes/bernie-sanders-bern-app-data/friend-to-friend.webm", type: "video/webm" },
-    { src: "/static/images/notes/bernie-sanders-bern-app-data/friend-to-friend.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        poster: "/static/images/notes/bernie-sanders-bern-app-data/poster-friend-to-friend.png",
-        controlsList: "nodownload",
-        preload: "metadata",
-        autoPlay: false,
-      },
-    },
-  }}
-  controls={true}
+  webm="/static/images/notes/bernie-sanders-bern-app-data/friend-to-friend.webm"
+  mp4="/static/images/notes/bernie-sanders-bern-app-data/friend-to-friend.mp4"
+  thumbnail="/static/images/notes/bernie-sanders-bern-app-data/poster-friend-to-friend.png"
 />

 ...and a few privacy-related questions about the friend-to-friend feature were answered by campaign staff in a separate closed webinar for volunteers this week:

-<Image src="/static/images/notes/bernie-sanders-bern-app-data/webinar-qa-1.png" width="400" height="155" alt="Q&A 1" />
+<Image
+  src="/public/static/images/notes/bernie-sanders-bern-app-data/webinar-qa-1.png"
+  width="400"
+  height="155"
+  alt="Q&A 1"
+/>

-<Image src="/static/images/notes/bernie-sanders-bern-app-data/webinar-qa-2.png" width="400" height="184" alt="Q&A 2" />
+<Image
+  src="/public/static/images/notes/bernie-sanders-bern-app-data/webinar-qa-2.png"
+  width="400"
+  height="184"
+  alt="Q&A 2"
+/>

 Defenders of the BERN app have pointed out that the information used is already available from public voter rolls maintained independently by each state. This is true. But these public records have never been tied to a campaign's internal voter files through a tool that's wide open to the entire internet, with incentives to add valuable data that benefits one candidate.

 There were even unverified claims that [BERN was leaking voter ID numbers](https://info.idagent.com/blog/bern-app-exposes-150m-voter-records), which are the same as one's driver's license ID numbers in some states, through JSON responses in the first few days after its release. There don't be appear to be strict rate limits on calls to the API either, potentially inviting malicious actors from around the world — wink wink — to scrape personal data on tens of millions of Americans en masse.

-<Figure src="/static/images/notes/bernie-sanders-bern-app-data/json-response.jpg" width="865" height="369">
+<Figure src="/public/static/images/notes/bernie-sanders-bern-app-data/json-response.jpg" width="865" height="369">
  BERN's API response in Chrome DevTools
 </Figure>

@@ -86,14 +80,14 @@ Others have noted that web-based organizing tools like BERN have been used by ca

 But the latter category of databases — like [NationBuilder](https://nationbuilder.com/) and, more notably, [NGP VAN's VoteBuilder](https://act.ngpvan.com/votebuilder) software based on the Obama campaign's inventions and now used by almost all Democratic campaigns across the United States — are secured and strictly guarded. Volunteer accounts need to be created and approved by paid campaign organizers and are locked down to provide the bare minimum amount of information necessary for one to canvass or phone bank a shortlist of voters. Every single click is also recorded in a [detailed log](sanders-campaign-audit.pdf) down to the millisecond. (This is how [Bernie's organizers got busted](https://time.com/4155185/bernie-sanders-hillary-clinton-data/) snooping around Hillary's VoteBuilder data last cycle, by the way.)

-<Figure src="/static/images/notes/bernie-sanders-bern-app-data/votebuilder-audit.png" width="750" height="447">
+<Figure src="/public/static/images/notes/bernie-sanders-bern-app-data/votebuilder-audit.png" width="750" height="447">
  [NGP VAN's audit of the Sanders campaign's VoteBuilder
  activity](/static/images/notes/bernie-sanders-bern-app-data/sanders-campaign-audit.pdf)
 </Figure>

 BERN is taking this to an unprecedented level. Allowing anybody on the internet to sign up and add others' personal information to the campaign's database without their knowledge is troubling, especially when you consider the gamified "points" system they've added as an incentive to report as much information on as many people as possible.

-<Figure src="/static/images/notes/bernie-sanders-bern-app-data/reddit-bros.png" width="600" height="301">
+<Figure src="/public/static/images/notes/bernie-sanders-bern-app-data/reddit-bros.png" width="600" height="301">
  [BERN discussion on /r/SandersForPresident
  thread](https://www.reddit.com/r/SandersForPresident/comments/bi15la/new_get_the_official_bernie_sanders_2020_app_bern/elxi85m/)
 </Figure>
@@ -101,7 +95,7 @@ BERN is taking this to an unprecedented level. Allowing anybody on the internet
 In addition to the points system, it was revealed in the webinar mentioned above that the campaign is planning on giving out shiny rewards based on how many friends one adds, setting expectations at 50+ contacts to reach the "Bernie Super Bundler" tier — whatever that means.

 <Image
-  src="/static/images/notes/bernie-sanders-bern-app-data/webinar-slide-1.png"
+  src="/public/static/images/notes/bernie-sanders-bern-app-data/webinar-slide-1.png"
  width="700"
  height="451"
  alt="Webinar Slide 1"
@@ -110,7 +104,7 @@ In addition to the points system, it was revealed in the webinar mentioned above
 In the middle of the webinar, the organizer also paused the presentation for _fifteen minutes_ — complete with a countdown clock — and told volunteers to race to add as many of their friends as possible in that time. She announced afterwards that participants added 20 to 40 friends into the app on average, with some allegedly adding close to 100 in fifteen minutes.

 <Image
-  src="/static/images/notes/bernie-sanders-bern-app-data/webinar-slide-2.png"
+  src="/public/static/images/notes/bernie-sanders-bern-app-data/webinar-slide-2.png"
  width="700"
  height="451"
  alt="Webinar Slide 2"
--- a/notes/cloudflare-dns-archive-is-blocked.mdx
+++ b/notes/cloudflare-dns-archive-is-blocked.mdx
@@ -11,13 +11,10 @@ tags:
 image: "/static/images/notes/cloudflare-dns-archive-is-blocked/archive-is.png"
 ---

-import Image from "../components/media/Image";
-import Tweet from "../components/media/Tweet";
-
 **tl;dr:** No. Quite the opposite, actually — [Archive.is](https://archive.is/)'s owner is intentionally blocking 1.1.1.1 users.

 <Image
-  src="/static/images/notes/cloudflare-dns-archive-is-blocked/archive-is.png"
+  src="/public/static/images/notes/cloudflare-dns-archive-is-blocked/archive-is.png"
  width="865"
  height="180"
  alt="Archive.today screenshot"
--- a/notes/cool-bash-tricks-for-your-terminal-dotfiles.mdx
+++ b/notes/cool-bash-tricks-for-your-terminal-dotfiles.mdx
@@ -12,10 +12,8 @@ tags:
 image: "/static/images/notes/cool-bash-tricks-for-your-terminal-dotfiles/terminal.png"
 ---

-import Image from "../components/media/Image";
-
 <Image
-  src="/static/images/notes/cool-bash-tricks-for-your-terminal-dotfiles/terminal.png"
+  src="/public/static/images/notes/cool-bash-tricks-for-your-terminal-dotfiles/terminal.png"
  width="320"
  height="284"
  alt="Terminal.app on macOS"
--- a/notes/coronavirus-open-source.mdx
+++ b/notes/coronavirus-open-source.mdx
@@ -11,159 +11,129 @@ tags:
 image: "/static/images/notes/coronavirus-open-source/covid19dashboards.png"
 ---

-import Image from "../components/media/Image";
-import Video from "../components/media/Video";
-
-export const Octocat = (props) => {
-  return (
-    <a
-      className="no-underline"
-      href={`https://github.com/${props.repo}`}
-      target="_blank"
-      rel="noopener noreferrer"
-      style={{ margin: "0 0.3em", color: "var(--text)" }}
-    >
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 16 16"
-        width="1em"
-        height="1em"
-        aria-hidden="true"
-        className="icon"
-        fill="currentColor"
-      >
-        <path
-          fillRule="evenodd"
-          d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0 0 16 8c0-4.42-3.58-8-8-8z"
-        />
-      </svg>
-    </a>
-  );
-};
-
 We're all quickly learning that worldwide pandemics can bring out both [the best](https://www.vox.com/culture/2020/3/13/21179293/coronavirus-italy-covid19-music-balconies-sing) and [the worst](https://twitter.com/9NewsAUS/status/1236088663093608448) of humanity. But one thing has become readily apparent to me — outside of the large teams of medical professionals risking their lives right this minute, the open source community stands alone in its ability to rapidly organize in the midst of chaos to give back to the world and, in this case, make it safer for all of us.

 These are just a few incredible open source projects that didn't exist a few months ago, but rapidly formed teams of dozens of contributors to fill both big needs and small niches in the fight to defeat the novel coronavirus, aka [**COVID-19**](https://www.cdc.gov/coronavirus/2019-nCoV/index.html).

-## [The COVID Tracking Project](https://covidtracking.com/) <Octocat repo="COVID19Tracking/website" />
+## [The COVID Tracking Project](https://covidtracking.com/) <OctocatLink repo="COVID19Tracking/website" />

 Now that Americans are _finally_ starting to get tested for the coronavirus, information and statistics about the results are being released state-by-state, which has led to a scattering of primary sources across the web, each releasing [different figures in different forms](https://docs.google.com/document/d/1OyN6_1UeDePwPwKi6UKZB8GwNC7-kSf1-BO2af8kqVA/edit). The [COVID Tracking Project](https://covidtracking.com/) collects as much information as possible from each local health authority's website and puts everything together in [easy-to-digest tables](https://covidtracking.com/data/), as well as [spreadsheets](https://docs.google.com/spreadsheets/u/2/d/e/2PACX-1vRwAqp96T9sYYq2-i7Tj0pvTf6XVHjDSMIKBdZHXiCGGdNC0ypEU9NbngS8mxea55JuCFuua1MUeOj5/pubhtml) and a [public API](https://covidtracking.com/api/).

 The maintainers are also [fully transparent](https://covidtracking.com/about-tracker/) about their process and take great care to annotate individual figures with the methodology used to arrive at each, which has earned them the [trust](https://covidtracking.com/#press) of even the largest national news organizations reporting on COVID-19.

 <Image
-  src="/static/images/notes/coronavirus-open-source/covidtracking.png"
+  src="/public/static/images/notes/coronavirus-open-source/covidtracking.png"
  width="680"
  height="328"
  alt="The COVID Tracking Project"
 />

-## [#findthemasks](https://findthemasks.com/) <Octocat repo="r-pop/findthemasks" />
+## [#findthemasks](https://findthemasks.com/) <OctocatLink repo="r-pop/findthemasks" />

 This one might be my favorite, simply because of its laser-like focus on solving a very specific (yet catastrophic) problem. The United States is [already running out](https://www.nytimes.com/2020/03/19/health/coronavirus-masks-shortage.html) of [personal protective equipment (PPE)](https://www.fda.gov/medical-devices/general-hospital-devices-and-supplies/personal-protective-equipment-infection-control) for the healthcare professionals on the front lines of this crisis. [#findthemasks.com](https://findthemasks.com/) has gathered specific donation requests and points of contact from hospitals around the country in desperate need of basic supplies.

 _Please_ look up your local hospitals on [#findthemasks](https://findthemasks.com/#sites) and follow their instructions to donate anything you have hoarded — it's likely the single most impactful thing you can do at this point. If you don't see your local hospital, or don't feel comfortable shipping equipment to any hospital listed, you can also visit [PPE Link](https://ppelink.org/ppe-donations/) and they will connect you with hospitals in your area.

 <Image
-  src="/static/images/notes/coronavirus-open-source/findthemasks.png"
+  src="/public/static/images/notes/coronavirus-open-source/findthemasks.png"
  width="600"
  height="295"
  alt="#findthemasks"
 />

-## [#StayTheFuckHome](https://staythefuckhome.com/) <Octocat repo="flore2003/staythefuckhome" />
+## [#StayTheFuckHome](https://staythefuckhome.com/) <OctocatLink repo="flore2003/staythefuckhome" />

 I figured I'd throw in this cheeky website broadcasting a simple but serious message: **STAY THE FUCK HOME!!!** If you're _still_ not convinced of the importance of this "suggestion," give their ["Self-Quarantine Manifesto"](https://staythefuckhome.com/) a quick read. Now.

 The [GitHub community](https://github.com/flore2003/staythefuckhome/pulls?q=is%3Apr) has translated the instructional essay into over a dozen different languages — including a [safe-for-work version](https://staythefuckhome.com/sfw/), if that helps — and they're [looking for more translators](https://github.com/flore2003/staythefuckhome#contributing) if you're multilingual and need something besides Netflix to fill your time with while you **_stay the fuck home!_** 😉

 <Image
-  src="/static/images/notes/coronavirus-open-source/staythefuckhome.png"
+  src="/public/static/images/notes/coronavirus-open-source/staythefuckhome.png"
  width="600"
  height="215"
  alt="#StayTheFuckHome"
 />

-## [COVID-19 Dashboards](https://covid19dashboards.com/) <Octocat repo="github/covid19-dashboard" />
+## [COVID-19 Dashboards](https://covid19dashboards.com/) <OctocatLink repo="github/covid19-dashboard" />

 This collection of various visualizations is fascinating (and sobering) to look at. If you're smarter than I am and have experience in data analysis, their team (led by a [GitHub engineer](https://github.com/hamelsmu)) would be more than happy to [add your contribution](https://github.com/github/covid19-dashboard/blob/master/CONTRIBUTING.md) to the site — they're using [Jupyter Notebooks](https://jupyter.org/) and [fastpages](https://github.com/fastai/fastpages).

 <Image
-  src="/static/images/notes/coronavirus-open-source/covid19dashboards.png"
+  src="/public/static/images/notes/coronavirus-open-source/covid19dashboards.png"
  width="580"
  height="442"
  alt="COVID-19 Dashboards"
 />

-## [CoronaTracker](https://coronatracker.samabox.com/) <Octocat repo="MhdHejazi/CoronaTracker" />
+## [CoronaTracker](https://coronatracker.samabox.com/) <OctocatLink repo="MhdHejazi/CoronaTracker" />

 CoronaTracker is a _beautiful_ cross-platform app for iOS and macOS with intuitive maps and charts fed by reputable live data. Apple is [being justifiably picky](https://developer.apple.com/news/?id=03142020a) about "non-official" Coronavirus apps in their App Store ([so is Google](https://blog.google/inside-google/company-announcements/coronavirus-covid19-response/), by the way) but you can still [download the macOS app directly](https://coronatracker.samabox.com/) or [compile the iOS source code](https://github.com/MhdHejazi/CoronaTracker#1-ios-app) yourself using Xcode if you wish.

 <Image
-  src="/static/images/notes/coronavirus-open-source/coronatracker.png"
+  src="/public/static/images/notes/coronavirus-open-source/coronatracker.png"
  width="865"
  height="417"
  alt="CoronaTracker"
 />

-## [Staying Home Club](https://stayinghome.club/) <Octocat repo="phildini/stayinghomeclub" />
+## [Staying Home Club](https://stayinghome.club/) <OctocatLink repo="phildini/stayinghomeclub" />

 A bit more family-friendly than [#StayTheFuckHome](https://staythefuckhome.com/), the [Staying Home Club](https://stayinghome.club/) is maintaining a running list of over a thousand companies and universities mandating that employees and students work from home, as well as events that have been canceled or moved online. Quarantining yourself might feel lonely, but here's solid proof that you're far from alone right now.

 <Image
-  src="/static/images/notes/coronavirus-open-source/stayinghome.png"
+  src="/public/static/images/notes/coronavirus-open-source/stayinghome.png"
  width="600"
  height="137"
  alt="Staying Home Club"
 />

-## [Nextstrain for nCoV](https://nextstrain.org/ncov) <Octocat repo="nextstrain/ncov" />
+## [Nextstrain for nCoV](https://nextstrain.org/ncov) <OctocatLink repo="nextstrain/ncov" />

 This one is a bit over my head, but apparently [Nextstrain](https://nextstrain.org/) is a pretty impressive open-source service targeted at genome data analysis and visualization of different pathogens. Their [COVID-19 page](https://nextstrain.org/ncov) is still awe-inspiring to look at for a layman like me, but probably a thousand times more so if you're an actual scientist — in which case, the [genome data they've open-sourced](https://github.com/nextstrain/ncov) might be of interest to you.

 <Image
-  src="/static/images/notes/coronavirus-open-source/nextstrain.png"
+  src="/public/static/images/notes/coronavirus-open-source/nextstrain.png"
  width="865"
  height="345"
  alt="Nextstrain for nCOV"
 />

-## [Johns Hopkins 2019-nCoV Data](https://systems.jhu.edu/research/public-health/ncov/) <Octocat repo="CSSEGISandData/COVID-19" />
+## [Johns Hopkins 2019-nCoV Data](https://systems.jhu.edu/research/public-health/ncov/) <OctocatLink repo="CSSEGISandData/COVID-19" />

 Johns Hopkins University's [visual COVID-19 global dashboard](https://www.arcgis.com/apps/opsdashboard/index.html#/bda7594740fd40299423467b48e9ecf6) has been bookmarked as my go-to source of information since the beginning of this crisis earlier this year. Now, JHU's [Center for Systems Science and Engineering](https://systems.jhu.edu/) has open-sourced [their data and analysis](https://github.com/CSSEGISandData/COVID-19) for anybody to use.

 <Image
-  src="/static/images/notes/coronavirus-open-source/hopkins.png"
+  src="/public/static/images/notes/coronavirus-open-source/hopkins.png"
  width="865"
  height="426"
  alt="Johns Hopkins 2019-nCoV Data"
 />

-## [COVID-19 Scenarios](https://neherlab.org/covid19/) <Octocat repo="neherlab/covid19_scenarios" />
+## [COVID-19 Scenarios](https://neherlab.org/covid19/) <OctocatLink repo="neherlab/covid19_scenarios" />

 COVID-19 Scenarios will probably hit everyone in a different way, depending on your levels of optimism and/or pessimism right now. It uses [advanced scientific models](https://neherlab.org/covid19/about) to predict the future of the virus based on past data and future variables and assumptions you can tinker with yourself.

 The maintainers at the [Neher Lab in Basel, Switzerland](https://neherlab.org/) even have a [discussion thread](https://github.com/neherlab/covid19_scenarios/issues/18) and an [open chatroom](https://spectrum.chat/covid19-scenarios/general/questions-discussions~8d49f461-a890-4beb-84f7-2d6ed0ae503a) set up for both scientists and non-scientists to ask questions and post ideas, which I find really nice of them!

 <Image
-  src="/static/images/notes/coronavirus-open-source/scenarios.png"
+  src="/public/static/images/notes/coronavirus-open-source/scenarios.png"
  width="740"
  height="433"
  alt="COVID-19 Scenarios"
 />

-## [Corona Data Scraper](https://coronadatascraper.com/#home) <Octocat repo="lazd/coronadatascraper" />
+## [Corona Data Scraper](https://coronadatascraper.com/#home) <OctocatLink repo="lazd/coronadatascraper" />

 Similar to the [COVID Tracking Project](https://covidtracking.com/) above, the [Corona Data Scraper](https://coronadatascraper.com/#home) has set up an automated process to scrape verified data from across the web to form massive CSV spreadsheets and JSON objects. They even [rate the quality](https://github.com/lazd/coronadatascraper#source-rating) of each source to prioritize data accordingly.

 <Image
-  src="/static/images/notes/coronavirus-open-source/coronadatascraper.png"
+  src="/public/static/images/notes/coronavirus-open-source/coronadatascraper.png"
  width="750"
  height="358"
  alt="Corona Data Scraper"
 />

-## [Folding@home](https://foldingathome.org/covid19/) <Octocat repo="FoldingAtHome/coronavirus" />
+## [Folding@home](https://foldingathome.org/covid19/) <OctocatLink repo="FoldingAtHome/coronavirus" />

 [Folding@home](https://foldingathome.org/) has been around [_forever_](https://en.wikipedia.org/wiki/Folding@home). I remember installing it on my family's home computer as a curious kid and making my father infuriated over how slow it got. But they [switched gears this month](https://foldingathome.org/2020/03/15/coronavirus-what-were-doing-and-how-you-can-help-in-simple-terms/) from using our computers to crunch various proteins and molecules in the background, and all of their power is now going towards discovering unknown "folds" in the coronavirus, which might be able to lead scientists to find better cures and potential vaccines.

@@ -172,30 +142,18 @@ You can [download their software here](https://foldingathome.org/start-folding/)
 **Fun fact:** The team behind Folding@home has seen a [**huge** spike in computational power](https://www.reddit.com/r/pcmasterrace/comments/flgm7q/ama_with_the_team_behind_foldinghome_coronavirus/) this month after cryptominers started mining coronavirus proteins instead of boring, old Ethereum with their insanely overpowered GPUs! 👏

 <Video
-  url={[
-    { src: "/static/images/notes/coronavirus-open-source/folding.webm", type: "video/webm" },
-    { src: "/static/images/notes/coronavirus-open-source/folding.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        poster: "/static/images/notes/coronavirus-open-source/folding-thumb.png",
-        autoPlay: true,
-        loop: true,
-        volume: 0,
-        muted: true,
-      },
-    },
-  }}
-  controls={false}
+  webm="/static/images/notes/coronavirus-open-source/folding.webm"
+  mp4="/static/images/notes/coronavirus-open-source/folding.mp4"
+  thumbnail="/static/images/notes/coronavirus-open-source/folding-thumb.png"
+  autoplay
 />

-## [Coronavirus Tracker API](https://coronavirus-tracker-api.herokuapp.com/v2/locations) <Octocat repo="ExpDev07/coronavirus-tracker-api" />
+## [Coronavirus Tracker API](https://coronavirus-tracker-api.herokuapp.com/v2/locations) <OctocatLink repo="ExpDev07/coronavirus-tracker-api" />

 To wrap this list up, I thought I'd include [yet another API](https://github.com/ExpDev07/coronavirus-tracker-api) fed by multiple data sources that you can use to create your own open-source project if any of these inspired you. This one is incredibly flexible in terms of [query parameters and endpoints](https://github.com/ExpDev07/coronavirus-tracker-api#api-endpoints) but they all return simple JSON responses like we all know and love.

 <Image
-  src="/static/images/notes/coronavirus-open-source/tracker-api.png"
+  src="/public/static/images/notes/coronavirus-open-source/tracker-api.png"
  width="712"
  height="371"
  alt="Coronavirus Tracker API"
--- a/notes/dropping-dropbox.mdx
+++ b/notes/dropping-dropbox.mdx
@@ -11,14 +11,9 @@ tags:
 image: "/static/images/notes/dropping-dropbox/email.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-import Tweet from "../components/media/Tweet";
-import Video from "../components/media/Video";
-
 I've been a loyal Dropbox user since its inception as a [Y Combinator startup](https://www.ycombinator.com/apply/dropbox/) ten years ago. Having a folder on all of my devices that instantly synchronized with each other was a game-changer for me, and I grew dependent on it more and more as they gave out free storage like candy — 48 GB for having a Samsung Chromebook, 1 GB for "Posting \<3 to Twitter," and so on — until I needed to upgrade to Dropbox Pro. But this month I canceled my Pro subscription after a few too many strikes.

-<Figure src="/static/images/notes/dropping-dropbox/email.png" width="504" height="223" priority>
+<Figure src="/public/static/images/notes/dropping-dropbox/email.png" width="504" height="223" priority>
  Deleting 401,907 files from Dropbox... 😬
 </Figure>

@@ -36,21 +31,9 @@ Decisions made by the top folks at Dropbox gave me an increasingly sour taste in
 - ...and as a bonus, making the process of canceling Dropbox Pro incredibly convoluted, annoying, and sketchy. Here's a video demonstration via [Justin Dunham](https://twitter.com/jwyattd):

 <Video
-  url={[
-    { src: "/static/images/notes/dropping-dropbox/cancel.webm", type: "video/webm" },
-    { src: "/static/images/notes/dropping-dropbox/cancel.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        poster: "/static/images/notes/dropping-dropbox/cancel.png",
-        controlsList: "nodownload",
-        preload: "metadata",
-        autoPlay: false,
-      },
-    },
-  }}
-  controls={true}
+  webm="/static/images/notes/dropping-dropbox/cancel.webm"
+  mp4="/static/images/notes/dropping-dropbox/cancel.mp4"
+  thumbnail="/static/images/notes/dropping-dropbox/cancel.png"
 />

 ## Seeking an alternative...
@@ -58,7 +41,7 @@ Decisions made by the top folks at Dropbox gave me an increasingly sour taste in
 The infamous [Apple Ecosystem™](https://medium.com/swlh/the-irresistible-lure-of-the-apple-ecosystem-81bf8d66294a) has held me firmly in its grasp for over a decade now, and the main requirement of a replacement cloud storage service for me was smooth interoperability between my MacBook, iPhone, and iPad.

 <Image
-  src="/static/images/notes/dropping-dropbox/icloud-storage.png"
+  src="/public/static/images/notes/dropping-dropbox/icloud-storage.png"
  width="865"
  height="137"
  alt="iCloud Drive storage"
@@ -66,7 +49,12 @@ The infamous [Apple Ecosystem™](https://medium.com/swlh/the-irresistible-lure-

 I've never been a proponent of leaving all your eggs in one basket. But it's hard to ignore the convenience of Apple's streamlined (and [finally](https://www.imore.com/developers-encounter-major-icloud-issues-ios-13-beta) reliable) [**iCloud Drive**](https://www.apple.com/icloud/), which is already installed on all of my devices (and actually cheaper than Dropbox gigabyte-for-gigabyte, at \$9.99/month for 2 TB). In fact, it's nearly invisible on macOS: I can simply save files in my Documents or Desktop folders as I always have and they're uploaded in the background. Git repositories now sync just fine and my files reappeared without a hitch after I recently formatted my Mac.

-<Image src="/static/images/notes/dropping-dropbox/icloud-drive.png" width="680" height="423" alt="iCloud Drive" />
+<Image
+  src="/public/static/images/notes/dropping-dropbox/icloud-drive.png"
+  width="680"
+  height="423"
+  alt="iCloud Drive"
+/>

 I still use (and highly recommend) [**Backblaze**](https://www.backblaze.com/) ([referral link](https://secure.backblaze.com/r/00x84e)) to backup my home folder and add a second layer of redundancy to storing all of my most important files on ["someone else's computer."](https://www.zdnet.com/article/stop-saying-the-cloud-is-just-someone-elses-computer-because-its-not/) And as long as I remember to plug in my external SSD every so often, they're also backed up locally via [Time Machine](https://support.apple.com/en-us/HT201250).

--- a/notes/finding-candidates-subdomain-takeovers.mdx
+++ b/notes/finding-candidates-subdomain-takeovers.mdx
@@ -11,14 +11,12 @@ tags:
 image: "/static/images/notes/finding-candidates-subdomain-takeovers/hackerone-2.png"
 ---

-import Figure from "../components/media/Figure";
-
 A **subdomain takeover** occurs when a subdomain (like _example_.jarv.is) points to a shared hosting account that is abandoned by its owner, leaving the endpoint available to claim for yourself.

 Not only are takeovers a fun way to dip your toes into [penetration testing](https://www.cloudflare.com/learning/security/glossary/what-is-penetration-testing/), but they can also be incredibly lucrative thanks to [bug bounty programs](https://en.wikipedia.org/wiki/Bug_bounty_program) on services like [HackerOne](https://hackerone.com/hacktivity?order_direction=DESC&order_field=popular&filter=type%3Aall&querystring=subdomain%20takeover) and [Bugcrowd](https://bugcrowd.com/programs), where corporations pay pentesters for their discoveries.

 <Figure
-  src="/static/images/notes/finding-candidates-subdomain-takeovers/hackerone-2.png"
+  src="/public/static/images/notes/finding-candidates-subdomain-takeovers/hackerone-2.png"
  width="620"
  height="347"
  priority
--- a/notes/github-actions.mdx
+++ b/notes/github-actions.mdx
@@ -11,12 +11,8 @@ tags:
 image: "/static/images/notes/github-actions/actions-flow.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-import Gist from "../components/media/Gist";
-
 <Image
-  src="/static/images/notes/github-actions/actions-flow.png"
+  src="/public/static/images/notes/github-actions/actions-flow.png"
  width="780"
  height="322"
  alt="Example workflow for a GitHub Action"
@@ -27,7 +23,7 @@ Since being accepted into the beta for [GitHub Actions](https://github.com/featu

 My favorite so far is my [Lighthouse Audit action](https://github.com/jakejarvis/lighthouse-action), which spins up a headless Google Chrome instance in an Ubuntu container and runs [Google's Lighthouse tool](https://developers.google.com/web/tools/lighthouse), which scores webpages on performance, accessibility, SEO, etc. and provides actual suggestions to improve them. It's a perfect example of the power of combining containers with Git workflows.

-<Figure src="/static/images/notes/github-actions/lighthouse-output.png" width="750" height="297">
+<Figure src="/public/static/images/notes/github-actions/lighthouse-output.png" width="750" height="297">
  The results of a Lighthouse audit on this website, after running tests in a headless Google Chrome.
 </Figure>

@@ -62,7 +58,7 @@ Using an action is also surprisingly simple, and more intuitive than [Travis CI]
 For a more complex example, when I forked [Hugo](https://github.com/gohugoio/hugo) (the static site generator used to build this website) to make some small personalized changes, I also translated [their `.travis.yml` file](https://github.com/gohugoio/hugo/blob/master/.travis.yml) into a [`workflow.yml` file](https://github.com/jakejarvis/hugo-custom/blob/master/.github/workflows/workflow.yml) for practice, which simultaneously runs comprehensive unit tests on **three operating systems** (Ubuntu 18.04, Windows 10, and macOS 10.14) with the latest two Go versions _each!_ If the tests are all successful, it builds a Docker image and pushes it to both [Docker Hub](https://hub.docker.com/r/jakejarvis/hugo-custom) and the [GitHub Package Registry](https://github.com/jakejarvis/hugo-custom/packages) (also [in beta](https://github.com/features/package-registry)).

 <Image
-  src="/static/images/notes/github-actions/hugo-logs.png"
+  src="/public/static/images/notes/github-actions/hugo-logs.png"
  width="865"
  height="418"
  alt="Build logs for my Hugo fork"
--- a/notes/github-rename-master.mdx
+++ b/notes/github-rename-master.mdx
@@ -12,11 +12,8 @@ tags:
 image: "/static/images/notes/github-rename-master/github-default.png"
 ---

-import Image from "../components/media/Image";
-import Tweet from "../components/media/Tweet";
-
 <Image
-  src="/static/images/notes/github-rename-master/blm-topic.png"
+  src="/public/static/images/notes/github-rename-master/blm-topic.png"
  width="865"
  height="162"
  alt="Black lives matter."
@@ -63,7 +60,7 @@ You can verify this worked by running `git branch -r`. You should see something
 Setting the default branch remotely is the only step that can't be done on the command line (although you can technically [use the GitHub API](https://github.com/erbridge/github-branch-renamer)). Head to **Settings → Branches** on GitHub to [change the default branch](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/changing-the-base-branch-of-a-pull-request).

 <Image
-  src="/static/images/notes/github-rename-master/github-default.png"
+  src="/public/static/images/notes/github-rename-master/github-default.png"
  width="810"
  height="405"
  alt="Changing the default branch of a GitHub repository"
@@ -86,7 +83,7 @@ Do a quick search of your codebase for `master` to manually replace any dead ref
 Pay attention to CI files — `.travis.yml`, `.github/workflows/`, `.circleci/config.yml`, etc. — and make sure there aren't any external services relying on `master` being there. For example, I almost forgot to change the branch [Netlify triggers auto-deploys](https://docs.netlify.com/site-deploys/overview/#branches-and-deploys) from to build this site:

 <Image
-  src="/static/images/notes/github-rename-master/netlify-deploy.png"
+  src="/public/static/images/notes/github-rename-master/netlify-deploy.png"
  width="720"
  height="460"
  alt="Netlify auto-deployment branch setting"
--- a/notes/how-to-backup-linux-server.mdx
+++ b/notes/how-to-backup-linux-server.mdx
@@ -12,10 +12,7 @@ tags:
 image: "/static/images/notes/how-to-backup-linux-server/apocalypse.png"
 ---

-import Figure from "../components/media/Figure";
-import Tweet from "../components/media/Tweet";
-
-<Figure src="/static/images/notes/how-to-backup-linux-server/apocalypse.png" width="865" height="303" priority>
+<Figure src="/public/static/images/notes/how-to-backup-linux-server/apocalypse.png" width="865" height="303" priority>
  **The Cloud-pocalypse:** Coming soon(er than you think) to a server near you.
 </Figure>

--- a/notes/how-to-pull-request-fork-github.mdx
+++ b/notes/how-to-pull-request-fork-github.mdx
@@ -12,8 +12,6 @@ tags:
 image: "/static/images/notes/how-to-pull-request-fork-github/step7-2.png"
 ---

-import Image from "../components/media/Image";
-
 <svg width="150" height="150" viewBox="0 0 40 40" style={{ float: "right", marginBottom: "6px", marginLeft: "12px" }}>
  <path d="M6.5 35v-4.8c0-5.4 4.3-9.7 9.7-9.7h7.6c5.4 0 9.7-4.3 9.7-9.7V6M6.5 32.5v-26" fill="none" stroke="#a3b7cc" />
  <path d="M6.5 10.5a4 4 0 110-8 4 4 0 010 8z" fill="#8bb7f0" />
@@ -36,7 +34,12 @@ Starting from the very beginning, we'll fork an existing repository to our accou

 Assuming you're using GitHub, this step is easy. Just find the repository you're contributing to and press the Fork button in the upper left. This will create an exact copy of the repository (and all of its branches) under your own username.

-<Image src="/static/images/notes/how-to-pull-request-fork-github/step1.png" width="865" height="80" alt="Step 1" />
+<Image
+  src="/public/static/images/notes/how-to-pull-request-fork-github/step1.png"
+  width="865"
+  height="80"
+  alt="Step 1"
+/>

 ## 2. Clone your new fork locally

@@ -46,7 +49,12 @@ GitHub will automatically redirect you to the forked repository under your usern
 git clone git@github.com:jakejarvis/react-native.git
 ```

-<Image src="/static/images/notes/how-to-pull-request-fork-github/step2.png" width="420" height="208" alt="Step 2" />
+<Image
+  src="/public/static/images/notes/how-to-pull-request-fork-github/step2.png"
+  width="420"
+  height="208"
+  alt="Step 2"
+/>

 ## 3. Track the original repository as a remote of the fork

@@ -94,9 +102,19 @@ git push -u origin fix-readme-typo

 You're now all ready to submit the improvement you've made to the project's maintainers for approval. Head over to the original repositories Pull Requests tab, and you should see an automatic suggestion from GitHub to create a pull request from your new branch.

-<Image src="/static/images/notes/how-to-pull-request-fork-github/step7-1.png" width="865" height="75" alt="Step 7.1" />
+<Image
+  src="/public/static/images/notes/how-to-pull-request-fork-github/step7-1.png"
+  width="865"
+  height="75"
+  alt="Step 7.1"
+/>

-<Image src="/static/images/notes/how-to-pull-request-fork-github/step7-2.png" width="700" height="354" alt="Step 7.2" />
+<Image
+  src="/public/static/images/notes/how-to-pull-request-fork-github/step7-2.png"
+  width="700"
+  height="354"
+  alt="Step 7.2"
+/>

 ---

--- a/notes/how-to-shrink-linux-virtual-disk-vmware.mdx
+++ b/notes/how-to-shrink-linux-virtual-disk-vmware.mdx
@@ -11,11 +11,8 @@ tags:
 image: "/static/images/notes/how-to-shrink-linux-virtual-disk-vmware/screen-shot-2018-12-07-at-2-04-04-pm.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-
 <Figure
-  src="/static/images/notes/how-to-shrink-linux-virtual-disk-vmware/screen-shot-2018-12-07-at-2-04-04-pm.png"
+  src="/public/static/images/notes/how-to-shrink-linux-virtual-disk-vmware/screen-shot-2018-12-07-at-2-04-04-pm.png"
  width="620"
  height="456"
  priority
@@ -82,7 +79,7 @@ VMware on macOS makes this a little tricky, since it packages VMs in what looks
 We need to right click on the .vmwarevm "file," and select **Show Package Contents** to see what's really in there. You should see the actual .VMDK file sitting there — normally we're looking for the plain VMDK file (named _Virtual Disk.vmdk_ by default) without a bunch of numbers after it, but if you have snapshots associated with your VM, this might not be the file we actually want. But run the command below with it anyways, and the output will tell you if you need to use a different file.

 <Image
-  src="/static/images/notes/how-to-shrink-linux-virtual-disk-vmware/screen-shot-2018-12-07-at-1-58-42-pm.png"
+  src="/public/static/images/notes/how-to-shrink-linux-virtual-disk-vmware/screen-shot-2018-12-07-at-1-58-42-pm.png"
  width="680"
  height="572"
  alt="Finding .vmwarevm in Finder"
--- a/notes/millenial-with-hillary-clinton.mdx
+++ b/notes/millenial-with-hillary-clinton.mdx
@@ -11,11 +11,8 @@ image: "/static/images/notes/millenial-with-hillary-clinton/24707394571_0818d4ab
 noComments: true
 ---

-import Figure from "../components/media/Figure";
-import Video from "../components/media/Video";
-
 <Figure
-  src="/static/images/notes/millenial-with-hillary-clinton/24707394571_0818d4ab83_o-1-copy.jpg"
+  src="/public/static/images/notes/millenial-with-hillary-clinton/24707394571_0818d4ab83_o-1-copy.jpg"
  width="865"
  height="411"
  priority
@@ -36,7 +33,7 @@ My goal here isn't to convince every Bernie believer to jump ship and support he
 After working for months as a fellow on Hillary's campaign in New Hampshire leading up to the first primary in the country, I could feed you all the standard campaign talking points in my sleep: After graduating from Yale Law she went to work at the [Children's Defense Fund](https://www.childrensdefense.org/), not a high-paying New York law firm. She [went undercover](https://www.nytimes.com/2015/12/28/us/politics/how-hillary-clinton-went-undercover-to-examine-race-in-education.html?_r=0) in Alabama to investigate discrimination in public schools. She [got juveniles out of adult prisons](https://www.huffingtonpost.com/entry/huffpost-criminal-justice-survey-democratics_us_56bb85eae4b0b40245c5038b). She [gave 8 million children healthcare](https://www.hillaryclinton.com/briefing/factsheets/2015/12/23/hillary-clintons-lifelong-fight-for-quality-affordable-health-care-for-all-americans/). But there's just one thing that, for some reason, is hard for people to believe: at her core she is a good, caring, and loving person who has had only selfless intentions her entire life. I promise you.

 <Figure
-  src="/static/images/notes/millenial-with-hillary-clinton/9e58a-1bvweqv_ve2_c1tw5-ihrhw.jpg"
+  src="/public/static/images/notes/millenial-with-hillary-clinton/9e58a-1bvweqv_ve2_c1tw5-ihrhw.jpg"
  width="400"
  height="500"
 >
@@ -55,39 +52,15 @@ I'm aware of the street cred young Democrats collect by claiming they hated Hill

 As [Bill Maher](https://medium.com/u/cdc04a9799f6) (an avid Bernie supporter) [said this weekend](https://www.youtube.com/watch?v=rd1gpjkjcfc), some in our party need to "learn the difference between an imperfect friend and a deadly enemy." I don't agree with everything Hillary has said or done. I don't unconditionally defend every single chapter in her public record over the past 30 years (and [neither does she](https://www.washingtonpost.com/blogs/post-partisan/wp/2016/02/25/hillary-clinton-responds-to-activist-who-demanded-apology-for-superpredator-remarks/), by the way). I don't think that's possible for any voter to find in a politician. But if you identify as a Democrat, she is the farthest thing from your enemy. Plain and simple. Like you and Bernie, she wants to prevent a Republican from winning in November and reversing so much of the progress we've made over the past seven years on their first day in office. That is our number one goal right now. And whether it gets accomplished by a President Clinton or a President Sanders, I am 100% on board either way. Let's stop fighting each other and start fighting together.

-<Video
-  url="https://www.youtube-nocookie.com/watch?v=TqrwDMTByNM"
-  light="https://i.ytimg.com/vi/TqrwDMTByNM/hqdefault.jpg"
-  controls
-/>
+<YouTube id="TqrwDMTByNM" />

 ---

 **Update:** The campaign has included my snowy New Hampshire interaction with her in one of the DNC convention videos! See a few short seconds of my joy at 1:24.

 <Video
-  url={[
-    { src: "/static/images/hillary/convention-720p.webm", type: "video/webm" },
-    { src: "/static/images/hillary/convention-720p.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        poster: "/static/images/hillary/thumb.png",
-        controlsList: "nodownload",
-        preload: "metadata",
-        autoPlay: false,
-      },
-      tracks: [
-        {
-          kind: "subtitles",
-          src: "/static/images/hillary/subs.en.vtt",
-          srcLang: "en",
-          label: "English",
-          default: true,
-        },
-      ],
-    },
-  }}
-  controls={true}
+  webm="/static/images/hillary/convention-720p.webm"
+  mp4="/static/images/hillary/convention-720p.mp4"
+  thumbnail="/static/images/hillary/thumb.png"
+  subs="/static/images/hillary/subs.en.vtt"
 />
--- a/notes/my-first-code.mdx
+++ b/notes/my-first-code.mdx
@@ -11,18 +11,20 @@ tags:
 image: "/static/images/notes/my-first-code/jbb-screen1.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-
 <Image
-  src="/static/images/notes/my-first-code/netscape.png"
+  src="/public/static/images/notes/my-first-code/netscape.png"
  width="865"
  height="155"
  alt="Awesome First Code on GitHub"
  priority
 />

-<Image src="/static/images/notes/my-first-code/badges.png" width="537" height="36" alt="Code Quality: A for effort" />
+<Image
+  src="/public/static/images/notes/my-first-code/badges.png"
+  width="537"
+  height="36"
+  alt="Code Quality: A for effort"
+/>

 I recently published my terrible, horrible, no good, very bad [first HTML site](https://jakejarvis.github.io/my-first-website/) and [first PHP project](https://github.com/jakejarvis/jbb#readme) ever and developed a new addiction to Web 1.0 nostalgia, fed by others who were brave enough to do the same.

@@ -32,7 +34,7 @@ Hopefully we can all look back at our first projects and be proud of how far we'

 ---

-<Figure src="/static/images/notes/my-first-code/jbb-logo.png" width="640" height="80">
+<Figure src="/public/static/images/notes/my-first-code/jbb-logo.png" width="640" height="80">
  [Jake's Bulletin Board](https://github.com/jakejarvis/jbb)
 </Figure>

@@ -163,16 +165,16 @@ while ($topic = mysql_fetch_object($result30)) {

 The installation "wizard" (that's the joke, I presume...) ([sql_submit.php](https://github.com/jakejarvis/jbb/blob/87b606797414b2fe563af85e269566fc5e076cc5/setup/sql_submit.php))

-<Figure src="/static/images/notes/my-first-code/jbb-screen1.png" width="865" height="458">
+<Figure src="/public/static/images/notes/my-first-code/jbb-screen1.png" width="865" height="458">
  JBB Installation Wizard
 </Figure>

 And finally, JBB's actual interface... or literally as much of it as I could get to function in 2019. ([index.php](https://github.com/jakejarvis/jbb/blob/87b606797414b2fe563af85e269566fc5e076cc5/index.php))

-<Figure src="/static/images/notes/my-first-code/jbb-screen3.png" width="865" height="561">
+<Figure src="/public/static/images/notes/my-first-code/jbb-screen3.png" width="865" height="561">
  JBB Homepage
 </Figure>

-<Figure src="/static/images/notes/my-first-code/jbb-screen4.png" width="865" height="493">
+<Figure src="/public/static/images/notes/my-first-code/jbb-screen4.png" width="865" height="493">
  JBB Post
 </Figure>
--- a/notes/netlify-analytics-review.mdx
+++ b/notes/netlify-analytics-review.mdx
@@ -12,12 +12,10 @@ tags:
 image: "/static/images/notes/netlify-analytics-review/overview.png"
 ---

-import Image from "../components/media/Image";
-
 I've been trying out [Netlify Analytics](https://www.netlify.com/products/analytics/) on this site for over a month now and have some quick thoughts about this unique offering in a world full of bloated and invasive tracking scripts.

 <Image
-  src="/static/images/notes/netlify-analytics-review/pageviews-2.png"
+  src="/public/static/images/notes/netlify-analytics-review/pageviews-2.png"
  width="865"
  height="361"
  alt="Pageview charts on Netlify Analytics"
@@ -55,7 +53,7 @@ Ad blocking is becoming commonplace on the World Wide Web with [over 25% of user
 That's a _huge_ chunk of visitors missing that Netlify Analytics gains back for you — and probably far more if your audience is tech-savvy like those reading this post likely are. (Some might even [block JavaScript completely](https://www.gnu.org/philosophy/javascript-trap.en.html) using extensions like [NoScript](https://addons.mozilla.org/en-US/firefox/addon/noscript/).)

 <Image
-  src="/static/images/notes/netlify-analytics-review/pages.png"
+  src="/public/static/images/notes/netlify-analytics-review/pages.png"
  width="865"
  height="390"
  alt="Pageview and 404 tracking on Netlify Analytics"
@@ -76,7 +74,7 @@ It makes sense that Netlify needs to subsidize the cost of providing free enterp
 ### 📈&nbsp; Accuracy

 <Image
-  src="/static/images/notes/netlify-analytics-review/sources-bandwidth.png"
+  src="/public/static/images/notes/netlify-analytics-review/sources-bandwidth.png"
  width="865"
  height="422"
  alt="Referrer and bandwidth tracking on Netlify Analytics"
@@ -93,7 +91,7 @@ One more note: since Netlify doesn't process IP addresses or user agents, bots c
 ### ⏱️&nbsp; Historical Data

 <Image
-  src="/static/images/notes/netlify-analytics-review/overview.png"
+  src="/public/static/images/notes/netlify-analytics-review/overview.png"
  width="865"
  height="355"
  alt="Overview of Netlify Analytics stats"
--- a/notes/presidential-candidates-404-pages.mdx
+++ b/notes/presidential-candidates-404-pages.mdx
@@ -10,12 +10,8 @@ tags:
 image: "/static/images/notes/presidential-candidates-404-pages/obama-laughing.jpg"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-import Video from "../components/media/Video";
-
 <Figure
-  src="/static/images/notes/presidential-candidates-404-pages/obama-laughing.jpg"
+  src="/public/static/images/notes/presidential-candidates-404-pages/obama-laughing.jpg"
  width="865"
  height="460"
  priority
@@ -32,7 +28,7 @@ More recently, though, little-known hidden Easter eggs on ["404 Not Found"](http
 I'm a _huge_ sucker for Kate McKinnon's spot-on impression of Warren on Saturday Night Live. And [unfortunately](https://twitter.com/realdonaldtrump/status/1097116612279316480), seeing a campaign embrace SNL is like a breath of fresh air these days. [Watch all of the Kate McWarren videos so far here; you won't regret it.](https://www.nbc.com/saturday-night-live/cast/kate-mckinnon-15056/impersonation/elizabeth-warren-287903)

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/warren.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/warren.png"
  width="865"
  height="579"
  alt="Elizabeth Warren"
@@ -43,21 +39,9 @@ I'm a _huge_ sucker for Kate McKinnon's spot-on impression of Warren on Saturday
 Although the designer who selected this GIF likely had _thousands_ of choices when searching "[Bernie finger wagging GIF](https://www.google.com/search?q=Bernie+finger+wagging+GIF&tbm=isch&tbs=itp:animated)," the text beside it is well-written and funny — even though we both know putting a page at [berniesanders.com/zxcliaosid](https://berniesanders.com/zxcliaosid/) probably won't be a top priority of a President Sanders.

 <Video
-  url={[
-    { src: "/static/images/notes/presidential-candidates-404-pages/sanders.webm", type: "video/webm" },
-    { src: "/static/images/notes/presidential-candidates-404-pages/sanders.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        autoPlay: true,
-        loop: true,
-        volume: 0,
-        muted: true,
-      },
-    },
-  }}
-  controls={false}
+  webm="/static/images/notes/presidential-candidates-404-pages/sanders.webm"
+  mp4="/static/images/notes/presidential-candidates-404-pages/sanders.mp4"
+  autoplay
 />

 ## 3. Joe Biden — [joebiden.com](https://joebiden.com/asdfasdf404)
@@ -65,7 +49,7 @@ Although the designer who selected this GIF likely had _thousands_ of choices wh
 Uncle Joe has a nice and simple 404 page. I like it, along with the Ray-Bans and his choice of vanilla ice cream.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/biden.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/biden.png"
  width="865"
  height="539"
  alt="Joe Biden"
@@ -76,21 +60,9 @@ Uncle Joe has a nice and simple 404 page. I like it, along with the Ray-Bans and
 A ballsy move, considering Beto's infamous [DUI arrest](https://www.politifact.com/texas/statements/2019/mar/14/club-growth/beto-orourke-arrested-dwi-flee-scene/) in the '90s — but still a clever ask for a donation and a great use of a GIF, even if it's left over from his Senate campaign.

 <Video
-  url={[
-    { src: "/static/images/notes/presidential-candidates-404-pages/orourke.webm", type: "video/webm" },
-    { src: "/static/images/notes/presidential-candidates-404-pages/orourke.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        autoPlay: true,
-        loop: true,
-        volume: 0,
-        muted: true,
-      },
-    },
-  }}
-  controls={false}
+  webm="/static/images/notes/presidential-candidates-404-pages/orourke.webm"
+  mp4="/static/images/notes/presidential-candidates-404-pages/orourke.mp4"
+  autoplay
 />

 ## 5. Kamala Harris — [kamalaharris.org](https://kamalaharris.org/asdfasdf404)
@@ -98,21 +70,9 @@ A ballsy move, considering Beto's infamous [DUI arrest](https://www.politifact.c
 Another clean and simple page with a top-notch GIF. It injected some emotion into visiting [kamalaharris.com/alskdjf](https://kamalaharris.com/alskdjf).

 <Video
-  url={[
-    { src: "/static/images/notes/presidential-candidates-404-pages/harris.webm", type: "video/webm" },
-    { src: "/static/images/notes/presidential-candidates-404-pages/harris.mp4", type: "video/mp4" },
-  ]}
-  config={{
-    file: {
-      attributes: {
-        autoPlay: true,
-        loop: true,
-        volume: 0,
-        muted: true,
-      },
-    },
-  }}
-  controls={false}
+  webm="/static/images/notes/presidential-candidates-404-pages/harris.webm"
+  mp4="/static/images/notes/presidential-candidates-404-pages/harris.mp4"
+  autoplay
 />

 ## 6. Pete Buttigeg — [peteforamerica.com](https://peteforamerica.com/asdfasdf404/)
@@ -120,7 +80,7 @@ Another clean and simple page with a top-notch GIF. It injected some emotion int
 I love, love, _love_ Pete's design for his whole campaign, and his beautiful 404 page is no exception. In case you didn't know, Pete for America has an entire ["Design Toolkit"](https://design.peteforamerica.com/) publicly available for all to view and use, with really cool and in-depth explanations for all of their choices — even their [color palette](https://design.peteforamerica.com/colors). Very progressive indeed.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/buttigeg.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/buttigeg.png"
  width="865"
  height="344"
  alt="Pete Buttigeg"
@@ -131,7 +91,7 @@ I love, love, _love_ Pete's design for his whole campaign, and his beautiful 404
 Love the photo choice. But although pains me to go against my Senator from my home state, I still _cannot stand_ his choice of font. Oh well, I guess that's now a criterion for running for president in 2020.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/booker.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/booker.png"
  width="865"
  height="503"
  alt="Cory Booker"
@@ -142,7 +102,7 @@ Love the photo choice. But although pains me to go against my Senator from my ho
 Not sure if donating to Yang 2020 will help put a page at [yang2020.com/alsdjfzoif](https://www.yang2020.com/alsdjfzoif) — the actual URL I visited to grab this screenshot — but the Bitmoji Andrew looks pretty chill.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/yang.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/yang.png"
  width="865"
  height="470"
  alt="Andrew Yang"
@@ -153,7 +113,7 @@ Not sure if donating to Yang 2020 will help put a page at [yang2020.com/alsdjfzo
 This is the 404 page of someone who won't forget the [Midwestern roots](https://en.wikipedia.org/wiki/Uff_da) she comes from once she moves into the White House...or writes a memoir about her campaign from her Minnesota home.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/klobuchar.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/klobuchar.png"
  width="865"
  height="456"
  alt="Amy Klobuchar"
@@ -164,7 +124,7 @@ This is the 404 page of someone who won't forget the [Midwestern roots](https://
 I'll never publicly say anything against a good Dad joke. This is no exception.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/bullock.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/bullock.png"
  width="865"
  height="467"
  alt="Steve Bullock"
@@ -175,7 +135,7 @@ I'll never publicly say anything against a good Dad joke. This is no exception.
 Another quality Dad joke here.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/bennet.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/bennet.png"
  width="865"
  height="543"
  alt="Michael Bennet"
@@ -186,7 +146,7 @@ Another quality Dad joke here.
 Yet another Dad joke? I honestly had the hardest time ranking these three.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/delaney.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/delaney.png"
  width="865"
  height="405"
  alt="John Delaney"
@@ -197,7 +157,7 @@ Yet another Dad joke? I honestly had the hardest time ranking these three.
 A 404 page only a motivational author and speaker running for president could envision.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/williamson.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/williamson.png"
  width="865"
  height="357"
  alt="Marianne Williamson"
@@ -208,7 +168,7 @@ A 404 page only a motivational author and speaker running for president could en
 I guess this would be slightly humorous...four years ago. Time to move on from your middle-school crush, Donny.

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/trump.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/trump.png"
  width="865"
  height="524"
  alt="Trump/Pence"
@@ -223,7 +183,7 @@ These candidates haven't configured a custom 404 page, settling for the default
 ### 15. Julián Castro — [julianforthefuture.com](https://www.julianforthefuture.com/asdfasdf404)

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/castro.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/castro.png"
  width="865"
  height="316"
  alt="Julián Castro"
@@ -232,7 +192,7 @@ These candidates haven't configured a custom 404 page, settling for the default
 ### 16. Wayne Messam — [wayneforusa.com](https://wayneforusa.com/asdfasdf404)

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/messam.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/messam.png"
  width="865"
  height="529"
  alt="Wayne Messam"
@@ -241,7 +201,7 @@ These candidates haven't configured a custom 404 page, settling for the default
 ### 17. Tulsi Gabbard — [tulsi2020.com](https://www.tulsi2020.com/asdfasdf404)

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/gabbard.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/gabbard.png"
  width="865"
  height="333"
  alt="Tulsi Gabbard"
@@ -250,7 +210,7 @@ These candidates haven't configured a custom 404 page, settling for the default
 ### 18. Joe Sestak — [joesestak.com](https://www.joesestak.com/asdfasdf404)

 <Image
-  src="/static/images/notes/presidential-candidates-404-pages/sestak.png"
+  src="/public/static/images/notes/presidential-candidates-404-pages/sestak.png"
  width="865"
  height="366"
  alt="Joe Sestak"
--- a/notes/security-headers-cloudflare-workers.mdx
+++ b/notes/security-headers-cloudflare-workers.mdx
@@ -11,11 +11,8 @@ tags:
 image: "/static/images/notes/security-headers-cloudflare-workers/security-headers.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-
 <Figure
-  src="/static/images/notes/security-headers-cloudflare-workers/security-headers.png"
+  src="/public/static/images/notes/security-headers-cloudflare-workers/security-headers.png"
  width="700"
  height="275"
  priority
@@ -28,7 +25,7 @@ In 2019, it's becoming more and more important to harden websites via HTTP respo
 [Cloudflare Workers](https://www.cloudflare.com/products/cloudflare-workers/) are a great feature of [Cloudflare](https://www.cloudflare.com/) that allows you to modify responses on-the-fly between your origin server and the user, similar to [AWS Lambda](https://aws.amazon.com/lambda/) (but much simpler). We'll use a Worker to add the headers.

 <Image
-  src="/static/images/notes/security-headers-cloudflare-workers/cf-workers.png"
+  src="/public/static/images/notes/security-headers-cloudflare-workers/cf-workers.png"
  width="650"
  height="325"
  alt="Cloudflare Workers"
--- a/notes/shodan-search-queries.mdx
+++ b/notes/shodan-search-queries.mdx
@@ -11,12 +11,9 @@ tags:
 image: "/static/images/notes/shodan-search-queries/shodan.png"
 ---

-import Image from "../components/media/Image";
-import Figure from "../components/media/Figure";
-
 Over time, I've collected an assortment of interesting, funny, and depressing search queries to plug into [Shodan](https://www.shodan.io/), the ([literal](https://www.vice.com/en_uk/article/9bvxmd/shodan-exposes-the-dark-side-of-the-net)) internet search engine. Some return facepalm-inducing results, while others return serious and/or ancient vulnerabilities in the wild.

-<Figure src="/static/images/notes/shodan-search-queries/shodan.png" width="865" height="248" priority>
+<Figure src="/public/static/images/notes/shodan-search-queries/shodan.png" width="865" height="248" priority>
  [**Most search filters require a Shodan account.**](https://account.shodan.io/register)
 </Figure>

@@ -50,7 +47,7 @@ The world and its devices are quickly becoming more connected through the shiny
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/billboard3.png"
+  src="/public/static/images/notes/shodan-search-queries/billboard3.png"
  width="450"
  height="329"
  alt="Example: Electronic Billboards"
@@ -63,7 +60,7 @@ The world and its devices are quickly becoming more connected through the shiny
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/7-11.png"
+  src="/public/static/images/notes/shodan-search-queries/7-11.png"
  width="600"
  height="226"
  alt="Example: Gas Station Pump Inventories"
@@ -76,7 +73,7 @@ P372 "ANPR enabled"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/plate-reader.png"
+  src="/public/static/images/notes/shodan-search-queries/plate-reader.png"
  width="680"
  height="284"
  alt="Example: Automatic License Plate Reader"
@@ -117,7 +114,7 @@ http.title:"Tesla PowerPack System" http.component:"d3" -ga3ca4f2
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/tesla.png"
+  src="/public/static/images/notes/shodan-search-queries/tesla.png"
  width="865"
  height="543"
  alt="Example: Tesla PowerPack Charging Status"
@@ -138,7 +135,7 @@ Shodan made a pretty sweet [Ship Tracker](https://shiptracker.shodan.io/) that m
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/sailor-vsat.png"
+  src="/public/static/images/notes/shodan-search-queries/sailor-vsat.png"
  width="700"
  height="361"
  alt="Example: Maritime Satellites"
@@ -157,7 +154,7 @@ title:"Slocum Fleet Mission Control"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/refrigeration.png"
+  src="/public/static/images/notes/shodan-search-queries/refrigeration.png"
  width="865"
  height="456"
  alt="Example: CAREL PlantVisor Refrigeration Units"
@@ -176,7 +173,7 @@ http.title:"Nordex Control" "Windows 2000 5.0 x86" "Jetty/3.1 (JSP 1.1; Servlet
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/c4max.png"
+  src="/public/static/images/notes/shodan-search-queries/c4max.png"
  width="865"
  height="171"
  alt="Example: C4 Max Vehicle GPS"
@@ -197,7 +194,7 @@ Secured by default, thankfully, but these 1,700+ machines still [have no busines
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/power-gaugetech.png"
+  src="/public/static/images/notes/shodan-search-queries/power-gaugetech.png"
  width="500"
  height="246"
  alt="Example: GaugeTech Electricity Meters"
@@ -239,7 +236,7 @@ Secured by default, thankfully, but these 1,700+ machines still [have no busines

 [Shodan Images](https://images.shodan.io/) is a great supplementary tool to browse screenshots, by the way! [🔎 →](https://images.shodan.io/?query=%22authentication+disabled%22+%21screenshot.label%3Ablank)

-<Figure src="/static/images/notes/shodan-search-queries/vnc.png" width="500" height="375">
+<Figure src="/public/static/images/notes/shodan-search-queries/vnc.png" width="500" height="375">
  The first result right now. 😞
 </Figure>

@@ -264,7 +261,7 @@ title:"Weave Scope" http.favicon.hash:567176827
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/weavescope.png"
+  src="/public/static/images/notes/shodan-search-queries/weavescope.png"
  width="865"
  height="465"
  alt="Example: Weave Scope Dashboards"
@@ -278,7 +275,12 @@ Older versions were insecure by default. [Very scary.](https://krebsonsecurity.c
 "MongoDB Server Information" port:27017 -authentication
 ```

-<Image src="/static/images/notes/shodan-search-queries/mongo.png" width="500" height="238" alt="Example: MongoDB" />
+<Image
+  src="/public/static/images/notes/shodan-search-queries/mongo.png"
+  width="500"
+  height="238"
+  alt="Example: MongoDB"
+/>

 ### [Mongo Express](https://github.com/mongo-express/mongo-express) Web GUI [🔎 →](https://www.shodan.io/search?query=%22Set-Cookie%3A+mongo-express%3D%22+%22200+OK%22)

@@ -289,7 +291,7 @@ Like the [infamous phpMyAdmin](https://www.cvedetails.com/vulnerability-list/ven
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/mongo-express.png"
+  src="/public/static/images/notes/shodan-search-queries/mongo-express.png"
  width="700"
  height="395"
  alt="Example: Mongo Express GUI"
@@ -302,7 +304,7 @@ Like the [infamous phpMyAdmin](https://www.cvedetails.com/vulnerability-list/ven
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/jenkins.png"
+  src="/public/static/images/notes/shodan-search-queries/jenkins.png"
  width="700"
  height="225"
  alt="Example: Jenkins CI"
@@ -353,7 +355,7 @@ Lantronix password port:30718 -secured
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/citrix.png"
+  src="/public/static/images/notes/shodan-search-queries/citrix.png"
  width="700"
  height="273"
  alt="Example: Citrix Virtual Apps"
@@ -386,7 +388,7 @@ Telnet Configuration: [🔎 →](https://www.shodan.io/search?query=%22Polycom+C
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/polycom.png"
+  src="/public/static/images/notes/shodan-search-queries/polycom.png"
  width="550"
  height="251"
  alt="Example: Polycom Video Conferencing"
@@ -419,7 +421,7 @@ HP-ILO-4 !"HP-ILO-4/2.53" !"HP-ILO-4/2.54" !"HP-ILO-4/2.55" !"HP-ILO-4/2.60" !"H
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/owa2007.png"
+  src="/public/static/images/notes/shodan-search-queries/owa2007.png"
  width="450"
  height="494"
  alt="Example: OWA for Exchange 2007"
@@ -432,7 +434,7 @@ HP-ILO-4 !"HP-ILO-4/2.53" !"HP-ILO-4/2.54" !"HP-ILO-4/2.55" !"HP-ILO-4/2.60" !"H
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/owa2010.png"
+  src="/public/static/images/notes/shodan-search-queries/owa2010.png"
  width="450"
  height="429"
  alt="Example: OWA for Exchange 2010"
@@ -445,7 +447,7 @@ HP-ILO-4 !"HP-ILO-4/2.53" !"HP-ILO-4/2.54" !"HP-ILO-4/2.55" !"HP-ILO-4/2.60" !"H
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/owa2013.png"
+  src="/public/static/images/notes/shodan-search-queries/owa2013.png"
  width="580"
  height="230"
  alt="Example: OWA for Exchange 2013/2016"
@@ -494,7 +496,7 @@ Concerning [default network shares of QuickBooks](https://quickbooks.intuit.com/
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/iomega.png"
+  src="/public/static/images/notes/shodan-search-queries/iomega.png"
  width="600"
  height="215"
  alt="Example: Iomega / LenovoEMC NAS Drives"
@@ -507,7 +509,7 @@ Redirecting sencha port:9000
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/buffalo.png"
+  src="/public/static/images/notes/shodan-search-queries/buffalo.png"
  width="580"
  height="140"
  alt="Example: Buffalo TeraStation NAS Drives"
@@ -520,7 +522,7 @@ Redirecting sencha port:9000
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/logitech.png"
+  src="/public/static/images/notes/shodan-search-queries/logitech.png"
  width="500"
  height="224"
  alt="Example: Logitech Media Servers"
@@ -539,7 +541,7 @@ Redirecting sencha port:9000
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/plexpy.png"
+  src="/public/static/images/notes/shodan-search-queries/plexpy.png"
  width="560"
  height="266"
  alt="Example: PlexPy / Tautulli Dashboards"
@@ -585,7 +587,12 @@ html:"DVR_H264 ActiveX"
 "Serial Number:" "Built:" "Server: HP HTTP"
 ```

-<Image src="/static/images/notes/shodan-search-queries/hp.png" width="700" height="272" alt="Example: HP Printers" />
+<Image
+  src="/public/static/images/notes/shodan-search-queries/hp.png"
+  width="700"
+  height="272"
+  alt="Example: HP Printers"
+/>

 ### Xerox Copiers/Printers [🔎 →](https://www.shodan.io/search?query=ssl%3A%22Xerox+Generic+Root%22)

@@ -594,7 +601,7 @@ ssl:"Xerox Generic Root"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/xerox.png"
+  src="/public/static/images/notes/shodan-search-queries/xerox.png"
  width="620"
  height="263"
  alt="Example: Xerox Copiers/Printers"
@@ -611,7 +618,7 @@ ssl:"Xerox Generic Root"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/epson.png"
+  src="/public/static/images/notes/shodan-search-queries/epson.png"
  width="550"
  height="308"
  alt="Example: Epson Printers"
@@ -628,7 +635,7 @@ ssl:"Xerox Generic Root"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/canon.png"
+  src="/public/static/images/notes/shodan-search-queries/canon.png"
  width="550"
  height="195"
  alt="Example: Canon Printers"
@@ -645,7 +652,7 @@ ssl:"Xerox Generic Root"
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/yamaha.png"
+  src="/public/static/images/notes/shodan-search-queries/yamaha.png"
  width="550"
  height="349"
  alt="Example: Yamaha Stereos"
@@ -682,7 +689,7 @@ title:"OctoPrint" -title:"Login" http.favicon.hash:1307375944
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/octoprint.png"
+  src="/public/static/images/notes/shodan-search-queries/octoprint.png"
  width="700"
  height="335"
  alt="Example: OctoPrint 3D Printers"
@@ -695,7 +702,7 @@ title:"OctoPrint" -title:"Login" http.favicon.hash:1307375944
 ```

 <Image
-  src="/static/images/notes/shodan-search-queries/eth.png"
+  src="/public/static/images/notes/shodan-search-queries/eth.png"
  width="800"
  height="141"
  alt="Example: Etherium Miners"
--- a/notes/y2k-sandbox.mdx
+++ b/notes/y2k-sandbox.mdx
@@ -10,13 +10,11 @@ tags:
 image: "/static/images/notes/y2k-sandbox/screenshot.png"
 ---

-import Figure from "../components/media/Figure";
-
 A few months ago, I stumbled upon [my first website ever](https://jakejarvis.github.io/my-first-website/) on an old floppy disk. Despite the instant cringing, I [uploaded it](https://github.com/jakejarvis/my-first-website) to GitHub, [collected other iterations](/previously/), and made an [#awesome-list](https://github.com/jakejarvis/awesome-first-code) of others who were brave and/or shameless enough to do the same. But why not take that ~~one~~ 1,000 steps further?

 Introducing the [**Y2K Sandbox**](https://y2k.app/) — with fully-featured, fully-isolated, on-demand [**Windows Millennium Edition®**](https://www.youtube.com/watch?v=CaNDeyYP98A) virtual machines, simply to experience my first website in its natural Internet Explorer 5 habitat. And maybe play some [3D Pinball: Space Cadet](https://en.wikipedia.org/wiki/Full_Tilt!_Pinball#3D_Pinball_for_Windows_%E2%80%93_Space_Cadet). Oh, and [Microsoft Bob](https://en.wikipedia.org/wiki/Microsoft_Bob) is there too if you want to say hello and catch up. 🤓

-<Figure src="/static/images/notes/y2k-sandbox/screenshot.png" width="865" height="649" priority>
+<Figure src="/public/static/images/notes/y2k-sandbox/screenshot.png" width="865" height="649" priority>
  [**Play in the Y2K Sandbox, at your own risk.**](https://y2k.app/)
 </Figure>

@@ -28,7 +26,7 @@ The frontend is _much_ simpler with [a few lines of JavaScript](https://github.c

 I must give credit to both [charlie.bz](https://charlie.bz/) and [benjojo.co.uk](https://benjojo.co.uk/), similar websites I was enamored with when they were posted on Hacker News a few years ago. Think we'll see some websites like these with Windows 29 in a decade?

-<Figure src="/static/images/notes/y2k-sandbox/windows-me.png" width="320" height="92">
+<Figure src="/public/static/images/notes/y2k-sandbox/windows-me.png" width="320" height="92">
  **@microsoft** Please don't sue me.
 </Figure>