RyanWarner

mmhmm web take home challenge

For this take home challenge, you'll be building a React app to manage the books on your bookshelf. Even though we don't sell books at mmhmm (yet), displaying content in cards like this is surprisingly similar to how we display video thumbnails.

So here's the (fake) situation

A designer on the team sent over this Figma doc and was told that we needed a frontend implementation of the design ASAP. The good news is a basic design and a v1 backend API are ready to start working with, and we just need to get a React app up and running. The bad news is we only have a few hours until we want to show the team a working demo.

Let's get started

RyanWarner

import fg from 'fast-glob'
import fs from 'fs'
import path from 'path'
import matter from 'gray-matter'
import { bundleMDX } from 'mdx-bundler'
import { remarkMdxImages } from 'remark-mdx-images'
import { IPostType } from 'types/IPostType'
import { IPostMeta } from 'types/IPostMeta'
import { IFrontmatter } from 'types/IFrontmatter'

RyanWarner

Sora Union QA take home challenge

For this take home challenge, you'll be testing / debugging a React app that manages the books on your bookshelf.

So here's the (fake) situation

We've just had the engineering team finish up a prototype for their new bookshelf app design. From a quick glance it looks fine but it's still very rough around the edges. The team needs you to run exploratory QA on this MVP so the engineering team can fix any bugs you might find before public release.

Alright let's go, there's no time to waste!

RyanWarner

/**
 * https://www.rfc-editor.org/info/bcp47
 * https://www.techonthenet.com/js/language_tags.php
 */

interface LanguageTag {
  tag: string
  language: string
  region: string
  description: string

RyanWarner

// Copied from https://github.com/integrations/slack/issues/374#issuecomment-386325109

/github subscribe owner/repo issues pulls deployments statuses public commits commits:all releases comments branches reviews

RyanWarner

// For an array of strings, remove special characters,
// replace spaces with hyphens,
// and convert all characters to lower case.

myArray.map(key => {
  const removeSpecials = key.replace(/[^a-zA-Z0-9 -]/, '').replace(/\.|!|'/g, '')
  const replaceSpaces = removeSpecials.replace(/ /g, '-')
  return replaceSpaces.toLowerCase()
})

RyanWarner

$ionicViewSwitcher.nextDirection( 'back' );

RyanWarner

input{
  -moz-box-sizing:    border-box;
  -webkit-box-sizing: border-box;
  box-sizing:        border-box;
  
  width: 200px;
}

RyanWarner

.fixed{
  position: fixed;
  -webkit-backface-visibility:hidden;
}

RyanWarner

// Author: Ryan Warner

@import "compass/css3";

@mixin buttons(){
	@include button;
	&.orange { @include button($gradient-top-color:#b0a999, $gradient-bottom-color:#756f64); }
	&.purple { @include button($gradient-top-color:#b099af, $gradient-bottom-color:#756474); }
}