Learning MDX Deck: Deploy To Netlify

In the previous article, Learning MDX Deck: Getting Started, I showed how to get up and running with MDX Deck. MDX Deck is a tool for creating presentation deck websites using MDX. But what good is creating a super sweet presentation if you canโ€™t easily show it off to your friends? Letโ€™s take the exact code from Learning MDX Deck: Getting Started and deploy it to Netlify.

Learning MDX Deck: Getting Started

๐Ÿ™‹ What is MDX Deck?

MDX Deck is a tool for creating presentation deck websites using MDX. MDX provides the ability to use Reactโ€™s JSX inside Markdown. The combination creates a powerful experience for building a web-based presentation deck. Here are a list of features, as listed on the MDX Deck GitHub Page:

  • ๐Ÿ“ Write presentations in markdown
  • โš› Import and use React components
  • ๐Ÿ’… Customizable themes and components
  • 0๏ธโƒฃ Zero-config CLI
  • ๐Ÿ’โ€โ™€๏ธ Presenter mode๏ฟผ
  • ๐Ÿ““ Speaker notes

4 Tips For Workplace Pranks

Any workplace can get stale, boring or in a rut. I think software development can be particularly susceptible because the high level of concentration needed to write code. Over the years Iโ€™ve found that that small breaks from the routine can help clear my head and allow me to better focus on my work. This typically means working a few minutes on the crossword or jigsaw puzzles in the break room when getting a coffee. Sometimes, it takes more than a puzzle to shake things up. Thatโ€™s when I like to play harmless pranks on my coworkers. If done right, not only can this cause a break from the routine but it can crack a few smiles and cause a little laughter.

My Favorite Vue Resources

To learn about Vue, I started following interesting people in the Vue community, listened to podcasts, and completed several tutorials. I thought it might be helpful to others to share some my favorite of those Vue resources.

2019 Self Improvement Plan

Before last year, I had not put together an improvement plan for myself for at least 10 years. Putting down my thoughts on how to get better as a developer really did help. While I didnโ€™t do all the things I set out to do, I did make progress towards last yearโ€™s general theme of putting myself out there more:

A New Vue On JavaScript30 - 08 Fun with HTML5 Canvas

This article is part of the A New Vue On JavaScript30 series that explores re-implementing Wes Bosโ€™s (@wesbos) #JavaScript30 projects using Vue. Today I will be working with #JavaScript30โ€™s 08 Fun with HTML5 Canvas project. This project uses a <canvas> element to provide a fun a way to draw in the browser window by clicking and dragging the mouse. As you draw, the line will get larger and smaller as well as change color. Here is an animated gif of it in action.

2018 Give Back Gift List

Every Christmas season, I always dread the task of coming up with gift ideas for me that family members can use. Is that too expensive? Is it not expensive enough? Can this very specific electronics part be easily purchased? These are just some of the questions I ask myself every year but NOT this year. Iโ€™m going to ๐Ÿ’€๐Ÿฆ๐Ÿฆโšซ. This year, I have the perfect way to build a list and it also checks off another thing I have been meaning to do. Support the free content producers and open source projects I use every day by purchasing their swag. So I present to you:

๐ŸŽ„๐ŸŽ„๐ŸŽ„ Dave Follettโ€™s 2018 Give Back Gift List ๐ŸŽ„๐ŸŽ„๐ŸŽ„

A New Vue On JavaScript30 - 06 Type Ahead

This article is part of the A New Vue On JavaScript30 series that explores re-implementing Wes Bosโ€™s (@wesbos) #JavaScript30 projects using Vue. Today I will be working with #JavaScript30โ€™s 06 - Type Ahead project. This project uses an input to filter down a list of cities as the user types. In addition to filtering the list, it also highlights the input value in the results. Here is an animated gif of it in action.

#JavaScript30 Finished Type Ahead Project

A New Vue On JavaScript30 - 05 Flex Panel Gallery

This article is part of the A New Vue On JavaScript30 series that explores re-implementing Wes Bosโ€™s (@wesbos) #JavaScript30 projects using Vue. Today I will be tackling #JavaScript30โ€™s 05 - Flex Panel Gallery project. This project displays a page of five images in vertical slices with words on them. When an image is clicked there is a neat animation to expand the image and slide in some additional text.

Accessibility Testing - aXe Browser Extension

Inspired by the syntax.fm podcast episode on website accessibility (a11y), I decided to try out the aXe browser extension created by Deque Systems. Though Wes and Scott mention several interesting tools, this one appealed to me because it sounded both robust and easy to use.

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×