Skip to content

Commit

Permalink
translated prereqs and finished to markdown
Browse files Browse the repository at this point in the history
  • Loading branch information
Frijol committed Sep 13, 2015
1 parent 598b289 commit bc71036
Show file tree
Hide file tree
Showing 4 changed files with 220 additions and 245 deletions.
209 changes: 5 additions & 204 deletions cmd.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,208 +2,9 @@
layout: default
---

<h1>Command Line Basics</h1>
<p>Using Tessel is just like web development. But if
you're not familiar with web development, you might want
to take a minute or two to get comfortable with some key
tools of the trade: the command line (the "terminal",
where you execute commands) and the text editor, where
you will work on and save your programs.</p>
<p>Select the operating system you are working on.</p>
<dl id="install-tabs" data-tab="" class=
"tabs contained three-up">
<dd class="active">
<a id="osx-tab" href="cmd.html#tab-osx" data-toggle=
"tab">OSX</a>
</dd>
<dd>
<a id="linux-tab" href="cmd.html#tab-linux"
data-toggle="tab">Linux</a>
</dd>
<dd>
<a id="pc-tab" href="cmd.html#tab-pc" data-toggle=
"tab">Windows</a>
</dd>
</dl>
<div id="install-content" class="tabs-content">
<div id="tab-osx" class="content active">
<p>Open up the application on your computer called
“Terminal” by pressing ⌘ + SPACE and typing
“Terminal”.</p>
<p>Its dock icon looks like <img src=
"https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term-icon.png">
, and the terminal will look something like
<img src="https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term.png">
</p>
<p>You can use the terminal to write commands to your
computer (this is the “command line”). Let’s try it
out!</p>
<p>In your terminal,
type</p><kbd><code>ls</code></kbd>
<p>and hit enter.</p>
<p>The <code>ls</code> command, short for “list”,
tells your computer to list all of the file names for
the folder you’re in. Your list of files probably
includes “Desktop” and “Documents”, among others.
Let’s try another command: type</p><kbd><code>cd
Documents</code></kbd>
<p>and hit enter.</p>
<p>You are now in the Documents folder;
<code>cd</code> means “change directory”. If you try
<code>ls</code> again, you should see the contents of
your Documents folder listed out. If you want to
compare, open up Finder and look in Documents to see
the same files.</p>
<p>Let’s get back to the folder we were in
before:</p><kbd><code>cd ..</code></kbd>
<p>You changed directory
again!</p><kbd><code>ls</code></kbd>
<p>to see what we have here. You’re back where you
started! The <code>..</code> after <code>cd</code>
tells it to go up one folder in the directory.</p>
<p>Ok, now you're a cool hacker who can use the
terminal (or "console") to write in the command line.
(If you want to learn more commands, there are a
whole bunch of them <a href="http://ss64.com/bash/"
target="1">here</a>. I recommend <code>pwd</code>,
<code>open</code>, <code>mkdir</code>,
<code>touch</code>, <code>mv</code>, and
<code>cp</code>.)</p>
</div>
<div id="tab-linux" class="content">
<p>Open up the application on your computer called
“Terminal” by tapping the SUPER key (Windows or Apple
key, depending on your hardware) and typing
“Terminal”.</p>
<p>Its icon looks like <img src=
"https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term-icon.png">
, and the terminal will look something like
<img src="https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term.png">
</p>
<p>You can use the terminal to write commands to your
computer (this is the “command line”). Let’s try it
out!</p>
<p>In your terminal,
type</p><kbd><code>ls</code></kbd>
<p>and hit enter.</p>
<p>The <code>ls</code> command, short for “list”,
tells your computer to list all of the file names for
the folder you’re in. Your list of files probably
includes “Desktop” and “Documents”, among others.
Let’s try another command: type</p><kbd><code>cd
Documents</code></kbd>
<p>and hit enter.</p>
<p>You are now in the Documents folder;
<code>cd</code> means “change directory”. If you try
<code>ls</code> again, you should see the contents of
your Documents folder listed out. If you want to
compare, open up Finder and look in Documents to see
the same files.</p>
<p>Let’s get back to the folder we were in
before:</p><kbd><code>cd ..</code></kbd>
<p>You changed directory
again!</p><kbd><code>ls</code></kbd>
<p>to see what we have here. You’re back where you
started! The <code>..</code> after <code>cd</code>
tells it to go up one folder in the directory.</p>
<p>Ok, now you're a cool hacker who can use the
terminal (or "console") to write in the command line.
(If you want to learn more commands, there are a
whole bunch of them <a href="http://ss64.com/bash/"
target="1">here</a>. I recommend <code>pwd</code>,
<code>open</code>, <code>mkdir</code>,
<code>touch</code>, <code>mv</code>, and
<code>cp</code>.)</p>
</div>
<div id="tab-pc" class="content">
<p>Open up the application on your computer called
“Command Prompt”.</p>
<p>If you’re not on Windows 8, go to the start menu
and type “Command Prompt”.</p>
<p>If you are on Windows 8+, swipe right to find
“Windows System”, within which you can find “Command
Prompt”.</p>
<p>Its icon looks like <img src=
"https://s3.amazonaws.com/technicalmachine-assets/fre+assets/win-term-icon.png">
, and the application (the terminal) will look
something like <img src=
"https://s3.amazonaws.com/technicalmachine-assets/fre+assets/win-term.png">
</p>
<p>You can use the terminal to write commands to your
computer (this is the “command line”). Let’s try it
out!</p>
<p>In your terminal,
type</p><kbd><code>dir</code></kbd>
<p>and hit enter.</p>
<p>The <code>dir</code> command, short for
“directory”, tells your computer to list all of the
file names for the folder you’re in. Your list of
files probably includes “Desktop” and “Documents”,
among others. Let’s try another command:</p>
<p>Now type</p><kbd><code>cd Documents</code></kbd>
<p>into your command line and press enter.</p>
<p>You are now in the Documents folder;
<code>cd</code> means “change directory”. If you try
<code>dir</code> again, you should see the contents
of your Documents folder listed out. If you want to
compare, open up My Comuter and look in Documents to
see the same files.</p>
<p>Let’s get back to the folder we were in
before:</p><kbd><code>cd ..</code></kbd>
<p>You changed directory
again!</p><kbd><code>dir</code></kbd>
<p>to see what we have here. You’re back where you
started! The <code>..</code> after <code>cd</code>
tells it to go up one folder in the directory.</p>
<p>Now you’re a cool hacker who can use the terminal
to write in the command line. (If you want to learn
more commands, there are a whole bunch of them
<a href="http://ss64.com/nt/" target=
"1">here</a>.)</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="large-12 columns fre-container">
<h3 id="text-editor">Text Editors</h3>
<p>You will also need a text editor to save your
JavaScript files. This means a plaintext editor, not a
Word document.</p>
<p>Here are some good options:</p>
<ul>
<li>
<a href="http://www.sublimetext.com/">Sublime
Text</a>
</li>
<li>
<a href="https://atom.io/">Atom</a>
</li>
<li>
<a href="http://notepad-plus-plus.org/">Notepad++</a>
</li>
</ul>
<script src="javascripts/custom/install.js"></script>

<p>Typically, directions that belong in the command line
are one line, whereas longer scripts, such as anything in
JavaScript, should be typed into the text editor and
saved, then run through the command line.</p>

<p>In the context of this tutorial, things that should be
run in the command line look</p><kbd><code>like
this</code></kbd>

<p>And scripts that should be saved in the text editor
will look</p>

<pre class="prettyprint">
<code>like this</code>
</pre>

<div class="greyBar"></div>

<div class="row">
<div class="large-12 columns right">
<a href="index.html" class="bottomButton right button">Next: Install</a>
</div>
</div>
{% capture include_install %}
{% include_relative cmd.md %}
{% endcapture %}
{{ include_install | markdownify | replace: '<p>|','<dd>' | replace: '|</p>','</dd>' | replace: '||','</dd><dd>' }}
178 changes: 178 additions & 0 deletions cmd.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,178 @@
{::options parse_block_html="true" /}

<div class="row">
<div class="large-12 columns">

# Command Line Basics

Using Tessel is just like web development. But if
you're not familiar with web development, you might want
to take a minute or two to get comfortable with some key
tools of the trade: the command line (the "terminal",
where you execute commands) and the text editor, where
you will work on and save your programs.

Select the operating system you are working on.

<dl id="install-tabs" data-tab="" class="tabs contained three-up">
| [OSX](#tab-osx) || [Linux](#tab-linux) || [Windows](#tab-windows) |
</dl>

<div id="install-content" class="tabs-content">

<div id="tab-osx" class="content active">

Open up the application on your computer called “Terminal” by pressing ⌘ + SPACE and typing “Terminal”.

Its dock icon looks like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term-icon.png), and the terminal will look something like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term.png)

You can use the terminal to write commands to your computer (this is the “command line”). Let’s try it out!

In your terminal, type

`ls`

and hit enter.

The `ls` command, short for “list”, tells your computer to list all of the file names for the folder you’re in. Your list of files probably includes “Desktop” and “Documents”, among others.

Let’s try another command: type

`cd Documents`

and hit enter.

You are now in the Documents folder; `cd` means “change directory”. If you try `ls` again, you should see the contents of your Documents folder listed out. If you want to compare, open up Finder and look in Documents to see the same files.

Let’s get back to the folder we were in before: `cd ..`

You changed directory again! `ls`
to see what we have here. You’re back where you started! The `..` after `cd` tells it to go up one folder in the directory.

Ok, now you're a cool hacker who can use the terminal (or "console") to write in the command line.

(If you want to learn more commands, there are a whole bunch of them <a href="http://ss64.com/bash/" target="1">here</a>. I recommend `pwd`, `open`, `mkdir`, `touch`, `mv`, and `cp`.)

</div>

<div id="tab-linux" class="content">

Open up the application on your computer called “Terminal” by tapping the SUPER key (Windows or Apple key, depending on your hardware) and typing “Terminal”.

Its icon looks like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term-icon.png), and the terminal will look something like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/mac-term.png)

You can use the terminal to write commands to your computer (this is the “command line”). Let’s try it out!

In your terminal, type

`ls`

and hit enter.

The `ls` command, short for “list”, tells your computer to list all of the file names for the folder you’re in. Your list of files probably includes “Desktop” and “Documents”, among others.

Let’s try another command: type

`cd Documents`

and hit enter.

You are now in the Documents folder; `cd` means “change directory”. If you try `ls` again, you should see the contents of your Documents folder listed out. If you want to compare, open up Finder and look in Documents to see the same files.

Let’s get back to the folder we were in before: `cd ..`

You changed directory again! `ls`
to see what we have here. You’re back where you started! The `..` after `cd` tells it to go up one folder in the directory.

Ok, now you're a cool hacker who can use the terminal (or "console") to write in the command line.

(If you want to learn more commands, there are a whole bunch of them <a href="http://ss64.com/bash/" target="1">here</a>. I recommend `pwd`, `open`, `mkdir`, `touch`, `mv`, and `cp`.)

</div>

<div id="tab-windows" class="content">

Open up the application on your computer called “Command Prompt”.

If you’re not on Windows 8, go to the start menu and type “Command Prompt”.

If you are on Windows 8+, swipe right to find “Windows System”, within which you can find “Command Prompt”.

Its icon looks like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/win-term-icon.png), and the application (the terminal) will look something like ![](https://s3.amazonaws.com/technicalmachine-assets/fre+assets/win-term.png)

You can use the terminal to write commands to your computer (this is the “command line”). Let’s try it out!

In your terminal, type

`dir`

and hit enter.

The `dir` command, short for “directory”, tells your computer to list all of the file names for the folder you’re in. Your list of files probably includes “Desktop” and “Documents”, among others. Let’s try another command:

Now type

`cd Documents`

into your command line and press enter.

You are now in the Documents folder; `cd` means “change directory”. If you try `dir` again, you should see the contents of your Documents folder listed out. If you want to compare, open up My Comuter and look in Documents to see the same files.

Let’s get back to the folder we were in before:

`cd ..`

You changed directory again!

`dir`

to see what we have here. You’re back where you started! The `..` after `cd` tells it to go up one folder in the directory.

Now you’re a cool hacker who can use the terminal to write in the command line. (If you want to learn more commands, there are a whole bunch of them <a href="http://ss64.com/nt/" target="1">here</a>.)

</div>
</div>
</div>
</div>

<div class="row">
<div class="large-12 columns fre-container">

<div id="text-editor">
### Text Editors

You will also need a text editor to save your JavaScript files. This means a plaintext editor, not a Word document.

Here are some good options:

* [Sublime Text](http://www.sublimetext.com/)
* [Atom](https://atom.io/)
* [Notepad++](http://notepad-plus-plus.org/)

</div>

Typically, directions that belong in the command line
are one line, whereas longer scripts, such as anything in
JavaScript, should be typed into the text editor and
saved, then run through the command line.

In the context of this tutorial, things that should be
run in the command line look `like this`

And scripts that should be saved in the text editor
will look

<pre class="prettyprint">
<code>like this</code>
</pre>

</div>
</div>

<div class="greyBar"></div>

<div class="row">
<div class="large-12 columns right">
<a href="index.html" class="bottomButton right button">Next: Install</a>
</div>
</div>
Loading

0 comments on commit bc71036

Please sign in to comment.