The "Learn Pixi.js" book. TypeScript Port

[8Observer8 37]

This is an official link to original book examples: https://github.com/kittykatattack/learningPixi

I will public examples on:

• Playground. You will be able to see a code and a result. I use complication to  AMD modules (Asynchronous Module Definition) and the RequireJS library to load AMD modules
• GitHub Pages. I use compilation to CommonJS modules. I bundle JS files to bundle.min.js using Browserify and minify it to bundle.min.js using UglifyJS
• Source code on GitHub: will be later

I will NOT use Webpack, Gulp, Grunt and so on. I will public the instruction on GitHub how to build examples locally in the README.md file.

Note. Release version is loaded more quickly, but on playground you can see a code, you can make a fork, change the code and save it with new link.

1. Hello World: playground, release

2. Displaying the canvas: playground, release

3.  Sprite From Image: playground

[ivan.popelyshev 762]

Thanks for trying to making my job easier. The more stuff we make, the easier it will be to answer all the newbie questions.

I'm also looking for the moment when i'll be able to integrate everything together - docs, wiki, hacks, examples, tutorials.

[d13 101]

Thanks for doing this!!! I also need to update the original tutorial for v.5, and make a few changes and improvements. 

[jonforum 61]

you also have a lot of video tutorial.
with some keyword and source youtube.
 

https://www.google.com/search?lr=&hl=fr&biw=1502&bih=750&tbs=srcf%3AH4sIAAAAAAAAANOuzC8tKU1K1UvOz1UrKc8sKUktArMzSnJzTNMTc1NTUsuKwSLJWUBubn4emJNYXl6eWJQCkQEqyizNBTMBuYgaTVAAAAA&tbm=vid&ei=DHyIXcaxA8ec_Qb0yrWoAQ&q="pixijs"&oq="pixijs"&gs_l=psy-ab.3...0.0.0.64091.0.0.0.0.0.0.0.0..0.0....0...1c..64.psy-ab..0.0.0....0.Nz8-mSaDSAA

 

 

[8Observer8 37]

3. Sprite From Image.

Playground

[8Observer8 37]

This is the first example from the book "Discover Phaser" in TypeScript and Phaser 3: Playground

 

[8Observer8 37]

I will publish on two Playgrounds: Plunker and CodeSandbox. If one is dead another will be available.

3. Sprite From Image: Plunker, CodeSandbox

[8Observer8 37]

Textured Rectangle in pure WebGL 1.0 and TypeScript. I use glMatrix for Linear Algebra.

Playground:

• Plunker: https://next.plnkr.co/edit/4pnm93F1eWQuvpYg?preview
• CodeSandbox: https://codesandbox.io/s/textured-rectangle-with-transforms-typescript-s7gfb

Source Code on GitHub (see a step-by-step instruction in the README.md file): https://github.com/8Observer8/textured-rect-with-transforms-webgl1-typescript

Edited October 19 by 8Observer8