tianm2009 / aliens-vscode

SVG and React in a VS Code Webview

Home Page:https://cdtdoug.ca/2018/08/31/aliens-vscode.html

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Aliens, Go Home! VS Code-style!

This is an adaptation based on the article Developing Games with React, Redux, and SVG.

The main changes are:

  • It's a VS code extension. Weird, but there's a reason for all this.
  • It's written in TypeScript. Because that's just a better way to write JavaScript.
  • It uses MobX instead of Redux. MobX is so much easier to work with.

The purpose of this exercise is to learn how to use SVG in VS Code webviews to provide visualizations for the artifacts and systems that developers work with when writing code in VS Code. React has support for SVG in it's virtual DOM so it's a natural for managing things like diagrams, etc., that change over time. And it's much easier to understand than D3.

And, it's just plain fun and crazy to see running inside VS Code!

About

SVG and React in a VS Code Webview

https://cdtdoug.ca/2018/08/31/aliens-vscode.html


Languages

Language:TypeScript 90.7%Language:JavaScript 8.6%Language:CSS 0.7%