pyreta

CoreWeave Design Challenge

In this challenge you will be provided with some screen shots from cloud.coreweave.com along with the colors used. You will then be given a list of specifications for a new feature design. Your submission will be a Figma (or something comparable) mockup of the feature UI meeting all of the specifications and matching our current brand. Bonus points for mobile and tablet views!

Complete as many of the specs as you can in time you are allotted. Any questions feel free to reach out.

Feature you will be creating - Storage Volume Management

A Storage Volume is essentially a virtual hard drive. Users can create different size volumes with various configurations and attach them to other virtual deployments in their namespace.

pyreta

Setup

Add a virtual MIDI device on your Mac

To your DAW, there is no difference between our keyboard program and a regular MIDI keyboard. We need to create a 'virtual' MIDI device that out program can use to send the MIDI to your DAW. This only needs to be done once.

1. Spotlight search 'midi' and choose Audio MIDI Setup

2. Choose Show MIDI Studio from Window menu

pyreta

The app has a button with the following function as a click handler

const doChatStuff = () => {
  const clientId = '123';
  const nick = 'twitch_name';
  const url = `https://id.twitch.tv/oauth2/authorize?client_id=${clientId}&redirect_uri=slobs-oauth://jingle_punks&response_type=token&scope=chat:edit&scope=chat:read`;
  try {
    window.streamlabsOBS.v1.Authorization.showAuthorizationWindow(
      url, { width: 600, height: 800 },

pyreta

Jingle Player Documentation

Contents:

• Tools used
• Structure
• State
• Storybook
• Mounting React
• Testing
• Style guide
• Styling

pyreta

Single Tab View:

Multi Tab View:

Cue Info:

Details:

pyreta

ChordBoard

ChordBoard is a virtual MIDI controller. It is the calculator of music production. With ChordBoard, you can harnass the power of music theory without having to memorize a bunch of crap. Ideal for music composers and producers. This program is currently only compatible on Macs.

any questions email pyreta@gmail.com

Table of Contents

• Setup

pyreta

New Playlist Features

In addition to some visual differences (new icons, etc.), some new features have been added to the playlist folder tree:

1) Right-click to access dropdown menu + shortcuts

• Dropdown menu is accessed by right-clicking instead of clicking gear icon
• Shortcut icons now appear in place of gear icon. These shortcuts include:
  • Playlist Header: new folder, new playlist
  • Playlists: wrap, report, and share
  • Folders (owned): create playlist, sharing options
• Folders (not owned): sharing details

pyreta

import React from 'react';
import styled from 'styled-components';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import Icon, { icons } from '../../../../../components/Icon';
import actions from '../../../../actions';
import IconWrapper from '.././IconWrapper';
import FolderWrapper from '../ListItem';
import stopPropagation, {
  interceptEvent,

pyreta

/*
This is a refactor from my previous job that I really like.  Before the refactor, I had declared at least 3 
different variables that were only necessary within the immediate function scope.  Then I tried nesting functions
passing arguments with arguments into arguments etc...

Using .map for objects other than arrays proves to be very useful here.  I no longer have to declare unneeded variables,
yet I still maintain readibility through a functional approach.  All that was needed was to wrap the object in brackets,
and then select the first index in that array at the end.

I have found this approach to be consistently useful.