Visualization Playground

Data Visualization Experimental Projects

🏗️ Deployments

Name	URL
Production	Not launched yet
Staging	https://visualization-playground.pages.dev

🍱 Tech Stack

• Astro + Vue + React
• TailwindCSS

🚀 Project Structure

Inside of your Astro project, you'll see the following folders:

/
├── public/ (Any static assets, like images)
├── src/
│   ├── components/
|   |   ├── Create a folder for components specific to you project.
│   ├── layouts/
│   └── pages/ (Each page is exposed as a route based on its file name.)
|       ├── Create new .astro file for your project page
└── package.json

🧞 Commands

All commands are run from the root of the project, from a terminal:

Command	Action
npm install	Installs dependencies
npm run dev	Starts local dev server at localhost:4321
npm run build	Build your production site to ./dist/
npm run preview	Preview your build locally, before deploying

🎨 Design Systems

• Use WeVis Design System's typography font family and sizes with slightly changes of CSS class name. Available typography CSS classes are defined in main.css