Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/cdaein/create-ssam

Quickstart your creative coding sketch with create-ssam
https://github.com/cdaein/create-ssam

canvas creative-coding generative-art glsl javascript lygia ogl ssam threejs typescript

Last synced: 5 days ago
JSON representation

Quickstart your creative coding sketch with create-ssam

Awesome Lists containing this project

README

        

# create-ssam

Ssam (쌈 as in Korean dish) wraps your HTML5 Canvas sketches and provides helpful features such as animation props, image and video exports on top of Node.js and Vite bundler. The design is minimal so you can bring your own canvas library (or use as vanilla js).

Learn how to quickstart a creative coding sketch with [`ssam`](https://github.com/cdaein/ssam) on its [wiki](https://github.com/cdaein/ssam/wiki). This package `create-ssam` sets up a basic sketch structure using one of the templates.

## How to

```sh
npm create ssam@latest
```

Then, follow the prompts.

It will set up all the necessary files and Vite bundler so you can go straight into creative coding.

## Templates

- Vanilla
- TypeScript
- JavaScript
- OGL
- Fullscreen Shader TS with Lygia
- Basic Cube TS
- Three
- Basic Cube TS
- Fullscreen Shader TS with Lygia
- Fullscreen Shader JS with Lygia
- StableDiffusion
- Replicate API TS

## Test Locally

- `npm run build`
- `npm link` to make it available locally
- on Desktop, `node ~/path/to/bin/create-ssam.js`
- follow setup instructions.

## License

MIT

The base code is adapted from [`create-vite`](https://github.com/vitejs/vite/tree/main/packages/create-vite)