Set up your programming environment

*wip

Must have for your Mac

Get homebrew – no longer drag an icon to install

Homebrew – “the missing package manager for macOS” will make it so much easier to download, upgrade and maintain your packages. It will install packages super transparently in /usr/local/Cellar/* and symlink commands to /bin.

Must have for node.js

nvm

a version manager for node. You will likely use many different node versions if you are pulling down different production repos, nvm will help you install and switch the the correct versions.

node.js

use nvm to install the latest version of node.js

$ nvm install node

 

TODO rust, iOS, python, scala, screen sharing

Weather reports from your terminal with curl

What is curl?

curl is a program that is included in your Mac OSX distribution used for transferring data from or to a server. It uses many supported protocols (HTTP, HTTPS, FTP, SMTP and more).

Do you have curl?

Find the location of the curl program (executable) with $ which curl. This will return /usr/bin/curl if you’re on Mac.

How do I use curl?

A simple http GET request can be made like this:

$ curl google.com

How to deal with 301 redirect 

Notice that you get a 301 message that is address has been “moved”. You can add the flag -L, --location (choose either) to “follow” redirects

$ curl -L google.com

$ curl --location google.com

How do I use curl to get the weather?

There is a service called wttr that is set up to return weather reports when you curl their service. This time we will use http for added security.

For a full local weather report:

$ curl https://wttr.in

Should I use http?

For todays weather report:

$ curl https://wttr.in?0

You can also specify a city or ski resort.

For todays weather report for New York:

curl https://wttr.in/~NewYork?0

Check if its snowy in your favorite ski resort – Charlotte Pass, Snowy Monaro, NSW, Australia

* Notice that wttr is returning special terminal characters to change the color. You can save these to examine this in your text editor.

Congrats! You got the weather!

Note that you can curl any web service, even ones you build yourself.

Want to build your own weather service? We’ll do that next in the Part II of this series.

Bonus Section:

Can I curl my own websites?

Yes! If you followed our github pages tutorial you’ll find you can curl your own website AND YOUR STATIC FILES

$ curl -L theptrk.github.io  <- website

$ curl -L theptrk.github.io/api/message.txt <- static txt file

 

*Update – this post got onto the hackernews front page and since then the API for wttr.in has been down. **Update, the API is back up!

Github Pages tutorial and exploration!

What is Github Pages

Github allows free and easy hosting for users to create an html page to represent users, organization and projects. All you have to do is upload your files through version control (git) and Github will serve your html, css and js – all static assets*.

How do you create a github page?

Step 1: Create a repo

Simply create a github repo called <username>.github.io.

My username is theptrk so I created the repo theptrk.github.io.

* Here are the command line instructions on your Mac:

curl -u <user_name> \
https://api.github.com/user/repos \
-d "{\"name\": \"<repo_name>\"}"

Step 2: Upload your index.html

Github will serve your index.html page by default so create this and git push

This is the most simple way to create  an html page

$ echo "Hello world!" > index.html

Step 3: Push your files to github

$ git add index.html

$ git commit -m "My first commit"

$ git push origin master

Visit your new Github webpage!

url: <username>.github.io

Mine is located at https://theptrk.github.io

What next?

Note that all your files are completely accessible at this path.

So if you create a javascript file called kale.js, you can access it with

https://your_username.github.io/kale.js and your index.html.

 

Exploration

Github will serve your static assets.

Will github serve text files?

Yes! I’m serving an entire copy of the Autobiography of Benjamin Franklin here

Will github serve css and javascript?

Yes! Add css files to your repo and reference them in index.html.

On most major browsers, you may even have module support like this:

|- index.html
|  <!DOCTYPE html>
|    Hello World
|    < script type="module" src="kale/index.mjs"></script>
|  </html>
|- mjs/
  |
  |- index.mjs
  |    import { hello } from './hello.mjs'
  |    hello()
  |
  |- hello.mjs
  |    function hello() {
  |      console.log('hello modules!');
  |    }
  |    export { hello }

When should you build your own ecommerce site vs using shopify?

Never.

Really not ever if you need to ask this question.

If you are building a new shopping experience, you likely aren’t really asking this question.

If you simply want to sell stuff online, do not go build a front end, payment system, taxation system, inventory management, temporary sales management, email collection, analytics, reviews, tags, discount codes, shopping cart, in-store blog with an authoring system, SEO optimization for images and links, and more just so you can sell your hand made soaps.

 

Put the keyboard down, use this Shopify referral link, sell your wares.

vim settings: tabs, spaces, indents

Basics

tabstop – amount to indent when using <Tab>

shiftwidth – amount to indent when using ‘>’ or ‘<‘

expandtab – always insert spaces at the amount of tabstop

set tabstop=4 set shiftwidth=4 set expandtab

 

How to change tab size based on filetype

setting it inline

make sure there are no spaces between the languages

autocmd FileType javascript,haskell set tabstop=2 shiftwidth=2

setting it with a function

autocmd FileType javascript, haskell call s:set_indents_at_2()

function! s:set_indents_at_2()
  set tabstop=2
  set shiftwidth=2
endfunction

 

How to detect if a user is online

Many browsers have implemented events “online” and “offline”; in addition to this, browsers also expose the navigator.onLine property that will return “online” or “offline”

How many browsers is many?

caniuse says every major browser (Chrome, Firefox, Safair, IE11…) except Opera mini has this functionality (as of July 4th 2018).

How can I check the online status?

> navigator.onLine

How can I listen to events?

BE LOUD

Be loud if core functionality depends on staying online

If your app depends on autosaving,

BE LOUD ABOUT NOT BEING ABLE TO SAVE.

Be like workflowy*. Tell the users, make them listen.

Caveats

You will likely need more error handling than this. For example: what if your server is offline? what if the request body has malformed? what if the server is up but your database is down? what if the api hits a 404 and do you let your devs know about this?

* referral link

How to protect your files from deletion

I wrote about this before, but its important enough to write twice

How to revoke write permissions to a directory

How to revoke your own user permissions 

$ chmod u-w dirname

How to delete all permissions from anyone on your system 

$ chmod a-w dirname

removing write access on a file does not stop it from being removed,

you must remove write access to the directory to protect the file from deletion – Ice Bear

How to test this

To test this, simple change the permissions and try to $ rm any_file_name. You can even rmdir dirnameand it will protect the directory from deletion

why vim?

vim is vi(improved)

vim is a powerful way that allows you to transform your thoughts into action in as little keystrokes as possible. In fact, the subtitle of the book Practical Vim is this:

“Edit Text at the Speed of Thought”

With that said, vim has a steep learning curve that often does not feel worth it if you are used to Command+c to copy, Command+v to paste and you like thinking while moving your mouse.

Its mostly mindful awareness

If vim has done one thing, its made me very cognizant of what I am trying to achieve. The emphasis on achieving as much in as little time, and the freeing of mental overhead from reaching all over the place, allows me to approach programming much more mindfully.

But as of today, “How to exit the Vim editor?” has 2644 votes on Stack Overflow!!!

 

Heres a tiny walkthrough.

vim intro walkthrough

Step 1: change var to const

To change var to const you simply need to type: ceconst<Esc>

where: c means change, e means until end of word, <Esc> takes you out of insert mode

 

Step 2: delete the word function

To get to the word “function” type: ff

where: f means find, the second f is the letter to find

To delete a word: de

 

Step 3: add an arrow behind the opening curly brace

To get to the char “{” type: f{

To insert “=>” type: i=><Esc>

where: i means insert, => is your input

 

Notice that we never touch the mouse! We never reach for the arrow keys.

In fact with the right shortcuts, you never take your fingers off the home keys. It’s really hard to state how much this frees your mind.

Until Elon Musk’s Neurolink allows as to change modes AND input text by brain implants, vim will be how to change text.

 

Intro to OSX File Management Commands

Filenames can have spaces!

So when you deal with them either surround the filename with apostrophes like this: "my file name.txt" or escape the spaces my\ file\ name.txt. Otherwise, don’t create new file names with spaces or escape characters to keep your sanity.

Wildcards

* greedy wildcard

? single character wildcard

[] single character list of wildcards

{} pattern list of wildcards

Say you have files:

kale1.txt, kale1a.txt, kale2.txt, kale2a.txt, kale3a.kale

$ ls kale?.txt – would match kale1.txt, kale2.txt

$ ls kale[1-3].txt – would match kale1.txt, kale2.txt

$ ls kale[1-3].txt – would match kale1.txt, kale2.txt

$ ls kale{2, 2a}.txt – would match kale2.txt, kale2a.txt

$ ls *.txt – would match all the txt files

$mv *.kale Kale\ Files – would move all .kale files to another directory

reading files and finding within files – cat, less, grep

cat – reading files

you can cat multiple files and even cat multiple files and pipe them into another

$ cat file1.txt file2.txt > files3.txt

less – reading files in a scrollable way

less is actually more, more is actually less! Note how this two executables are the exact same size!

$ ls -l /usr/bin/{more,less}

How to make less more bearable

$ less -M filename – the M flag will show you where you are in the file and what percentage you are in.

During less:

Space – advance to the next page

b – advance back one page

v – starts vim

g – goes to beginning of file

G – goes to end of file

/word searches forward for a word

?word searches backwards for a word

grep – finding within files

grep uses a different, more sophisticated regular expressions system then the wildcards from above

$ grep secrets *.txt – searches for the text “secrets” in all the .txt files

moving and copying files with wildcards!

mkdir – making directories

mkdir takes wildcards! So if you wanted to make a different directory for the next three years, try:

$ mkdir taxes20{18,19,20}

cp – copying

cp takes wildcards! So if you wanted to move those new directories into a sub directory

$ touch taxes20{18,19,20}.txt # creates these files
$ cp taxes20{18,19,20}.txt ./taxes # copies those files into a new “taxes” directory

mv – moving

more wildcards!

$ mv -i taxes20{18,19,20}.txt ./my_taxes # moves those files into a new “my_taxes” directory interactively

rm – removing

$ rm -i .[^.]* removes all hidden files (., ..)

$ rm -i taxes*.txt removes all files with that wildcard

compressing

gzip for single files

$ ls -l to check the size of the file you are going to compress

Then use $ gzip -v to compress (verbose), $ gunzip -v to uncompress (verbose)

tar for directories, tar+gzip for the ultimate combo

$ du -s Kale\ Recipes to check the size in 512 byte blocks

$ tar -czvf my_kale_recipes.tgz "Kale Recipes" – to compress

$ tar -xvzf my_kale_recipes.tgz – to uncompress

where:

-c is to designate you are creating an archive

-x is to designate you are extracting an archive

-z is for using gzip,

-v is for verbose,

-f is to designate you are providing a filename

.tgz is the file extension for tarballs that are gzipped, sometimes you will see .tar.gz

Intro to your OS X Filesystem and Permissions

How to find home

note: as a user of the system you will be given a user directory under the Users directory

$ echo $HOME

How to go to the home directory choices:

$ cd $HOME$ cd ~$ cd, and

$ cd then drag your home directory from your Finder window

How to go to the root directory

note: when you see pathnames as such Users/patrick/Documents, this is an “absolute” path name starting at the root

$ cd /

How to print your working/current directory

note: every terminal window operates an independent working directory

$ pwd

How to list your files

$ ls

$ ls -F – this will append a forward slash (/) to directories, an asterisk (*) to executables or scripts, an (@) to symbolic links

$ ls -al – this will show the “long” version of “all” files in the directory

file permissions are shown on the first column in a super cryptic way like this (feel free to skip this portion: 

drwxr-xr-x

these are:

file type (1 char) – here “d” is directory, “-” would’ve meant file

owners file permission (3 char) – the owner has read, write, executable permissions on this directory

group file permission (3 char) – everyone in this users group has read and executable permissions

others file permission (3 char) – everyone on the computer in any group has read and execute permissions

How to see the disk usage of:

$ du Documents/Outline.doc (size of a file in 512-byte blocks)

$ du -s Documents (summary size of the directory in 512 byte blocks)

$ du -sh Documents (summary size of the directory in human readable format)

How to see the remaining free disk space

$ df -H (human readable disk free space using base 10 to calculate sizes)

How to change the permissions on files and directories

$ chmod "categories" "add/subtract" "permissions" "filename"

The categories permission options are:

u  owner, g  groups, o others, and

a – all permissions, owner, groups and others

The add/subtract options are:

+  adding, -  subtracting

The permission options are:

r  read, w  write, x  execute

Examples:

How to delete your user permission from removing the files within a directory (write access)

$ chmod u-w dirname

How to delete all permissions from removing the files within a directory (write access)

$ chmod a-w dirname

removing write access on a file does not stop it from being removed, you must remove write access to the directory to protect the file from deletion – Ice Bear

How to change the owner of a file or directory

$ chown some_name filename

 

Part II – Intro to OSX file management