https://github.com/alanbsmith/canvas-kit-v5-starter
a starter repo for the canvas kit v5 workshop
https://github.com/alanbsmith/canvas-kit-v5-starter
Last synced: about 1 year ago
JSON representation
a starter repo for the canvas kit v5 workshop
- Host: GitHub
- URL: https://github.com/alanbsmith/canvas-kit-v5-starter
- Owner: alanbsmith
- Created: 2021-04-26T17:44:08.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2021-06-29T15:19:05.000Z (about 5 years ago)
- Last Synced: 2025-06-03T20:46:03.662Z (about 1 year ago)
- Language: TypeScript
- Size: 699 KB
- Stars: 1
- Watchers: 2
- Forks: 6
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Canvas Kit V5 Workshop Starter
_a starter repo for the V5 Canvas Kit Workshop_
## Table of Contents
- [Canvas Kit V5 Workshop Starter](#canvas-kit-v5-workshop-starter)
- [Table of Contents](#table-of-contents)
- [Up & Running](#up--running)
- [Resources](#resources)
- [Templates](#templates)
- [Figma Specs](#figma-specs)
- [Docs](#docs)
- [Walkthrough Guide](#walkthrough-guide)
## Up & Running
First, you'll want to fork this repo and install dependencies:
```sh
yarn install
```
Then start the development server:
```sh
yarn start
```
And visit `http://localhost:3000/`
## Resources
### Templates
- [Session Start Sandbox](https://codesandbox.io/s/canvas-kit-v5-workshop-session-1-start-5po3p)
- [Session Finish Sandbox](https://codesandbox.io/s/canvas-kit-v5-workshop-session-1-finish-et5rd)
### Figma Specs
- [Complete UI](https://www.figma.com/file/SNDE0b4SBlKz2NXOuizsaz/Canvas-Kit-Workshop-Spec?node-id=42%3A0)
- [Page Layout](https://www.figma.com/file/SNDE0b4SBlKz2NXOuizsaz/Canvas-Kit-Workshop-Spec?node-id=135%3A556)
- [Card Layout](https://www.figma.com/file/SNDE0b4SBlKz2NXOuizsaz/Canvas-Kit-Workshop-Spec?node-id=98%3A4467)
### Docs
- [Type token docs](https://github.com/Workday/canvas-kit/tree/master/modules/react/tokens#type)
- [Box docs](https://workday.github.io/canvas-kit/?path=/docs/labs-common-box--as#box)
- [Flex docs](https://workday.github.io/canvas-kit/?path=/docs/labs-layout-flex--usage#flex)
- [Stack docs](https://workday.github.io/canvas-kit/?path=/docs/labs-layout-stack--basic-stack#stack-hstack-and-vstack)
- [Canvas Kit docs](https://workday.github.io/canvas-kit/)
### Walkthrough Guide
- [Step-by-step guide](https://gist.github.com/alanbsmith/c960da5c23127d74929e00ca9c67fbc9)