Coder Social home page Coder Social logo

typescriptos's Introduction

AlanBBOS2014

This is my Fall 2014 Operating Systems class initial project. See http://www.labouseur.com/courses/os/ for details.

Setup TypeScript/Gulp

  1. Install npm, if you don't already have it
  2. npm install tsc to get the TypeScript Compiler
  3. npm install gulp to get the Gulp Task Runner
  4. npm install gulp-tsc to get the Gulp TypeScript plugin

Your Workflow

Just run gulp at the command line in the root directory of this project! Edit your TypeScript files in the source/scripts directory in your favorite editor. Visual Studio has some additional tools that make debugging, syntax highlighting, and more very easy!

Gulp will automatically:

  • Watch for changes in your source/scripts/ directory for changes to .ts files and run the TypeScript Compiler on it
  • Watch for changes to your source/styles/ directory for changes to .css files and copy them to the dist/ folder

TypeScript FAQs

What's TypeScript? TypeScript is a language that allows you to write in a statically-typed language that outputs standard JS!

Why should I use it? This will be especially helpful for an OS or a Compiler that may need to run in the browser as you will have all of the great benefits of type checking built right into your language.

Where can I get more info on TypeScript Right this way!

Gulp FAQs

Why are we using Gulp? Gulp is a tool that allows you to automate tons of workflow tasks. In this instance, we want it to watch our directory for changes and automatically run the TypeScript compiler on the source files to output JS to a distribution folder. We also use it to copy over .css files to our distribution folder.

Copying over CSS files to a dist folder? That seems useless Well, in this case, it pretty much is, but it keeps your development consistent. You keep your source in the source directory, and you keep what you want to output to the user in the dist directory. In more mature front-end environments, you may be utilizing a CSS-preprocessor like LESS or SASS. This setup would allow you to keep your .less or .scss files in the source/styles directory, then output the compiled css folders to the dist/styles directory.

What other cool things can I do with Gulp? If you were in a production environment where you wanted to obfuscate your code, you can use Gulp to automatically run things like Uglify on your JS/CSS. Or if you wanted to minify your CSS. It is NOT recommended to do this for this project as you'll need to debug this code and allow Glados to run code against yours.

Where can I get more info on Gulp? Right this way!

typescriptos's People

Contributors

bobnisco avatar labouseur avatar w0jnar avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Forkers

alanclasses

typescriptos's Issues

Typescript setup in readme

Typing npm install tsc on my debian box gives me:

npm ERR! 404 404 Not Found: tsc
npm ERR! 404
npm ERR! 404 'tsc' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, or http url, or git url.
npm ERR! System Linux 3.2.0-4-amd64
npm ERR! command "/usr/bin/nodejs" "/usr/bin/npm" "install" "tsc"
npm ERR! cwd /home/jacob
npm ERR! node -v v0.10.29
npm ERR! npm -v 1.4.21
npm ERR! code E404
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! /home/jacob/npm-debug.log
npm ERR! not ok code 0

The typescript site (http://www.typescriptlang.org/#Download) says to use npm install -g typescript which does work.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.