Author: theptrk

Using CAShapeLayer to draw a circle

UIViews are like Ogres, which are like onions – they have layers.

Source: Documentation

More accurately, UIView has a single layer property that can have infinite sublayers.

UIView’s have layers

Lets draw a circle.

First create a UIView and a CAShapeLayer:

let myView = UIView()

let myLayer = CAShapeLayer()

Layers have a path

UIBezierPath makes drawing shapes extremely smooth, lets say in the shape of a circle:

let circlePath = UIBezierPath(
  arcCenter: CGPoint(x: 100.0, y: 100.0),
  radius: 100,
  startAngle: 0 * CGFloat.pi / 180,
  endAngle: 360 * CGFloat.pi / 180,
  clockwise: true)

Great! Now we can add CAShapeLayer as a CGPath and spruce up our fill and stroke colors

myLayer.path = circlePath.cgPath
myLayer.strokeColor = UIColor.blue.cgColor
myLayer.fillColor = UIColor.yellow.cgColor

Last step! Add this layer to your UIView

myView.layer.addSublayer(myLayer)

Layers have attributes

strokeColor,fillColor, opacity, lineWidth and more!

Bonus: Layers can animate attributes

// create the animation
let opacityAnimation = CABasicAnimation(
  keyPath: #keyPath(CALayer.opacity))
opacityAnimation.fromValue = 0
opacityAnimation.toValue = 1
opacityAnimation.duration = 5.0

// set the final value; add the animation
myLayer.opacity = 1
myLayer.add(opacityAnimation, forKey: #keyPath(CALayer.opacity))

iOS Application Lifecycle – UIKit basics

iOS applications are all about cycles

This is because the iOS applications are richly interactive when it comes to user input and much of your programming with UIKit will be delegate oriented. Knowing the many different “cycles” of the device and application will be illuminating for your development.

States of the UIKit App Cycle

* These are the execution states of a UIKit app from the Apple docs. But why so many arrows? Below is the simplified flow charts

User Action: Your app has not been launched

Your application starts off Current State: Not Running

User Action: Your app is launched

Delegate method called: application(_:didFinishLaunchingWithOptions:)

New state: Inactive – your application is briefly here as it prepares a successful launch

New state: Active – your application is now the “foreground app”.

Many apps will place a majority of the app setup logic in this function including setting up a programmatic view controller setup (bypassing the default storyboard)

Delegate method called: applicationDidBecomeActive

User Action: User goes to home screen or opens another app

 

Current state: Active

Delegate method called: applicationWillResignActive

New state: Inactive – your application is briefly here

New state: Background – your app is available in the app picker screen on home button double tap

Delegate method called: applicationDidEnterBackground*

* If your app does not support background execution “applicationWillTerminate” is called

** If your iOS device is low on memory, it may suspend and even terminate your app back to the state “Not Running”

User Action: User reopens a background app

Current state: Background

Delegate method called: applicationWillEnterForeground

New state: Active

Delegate method called: applicationDidBecomeActive

 

TLDR: Your basic UIKit flow moves from Active <-> Background

These are only the basic lifecycle events for your UIKit app, there are MANY different scenarios that can change the state of your app – the device can span a low battery warning and show the power saving alert, a phone call may occur, users can click and hold notifications, the device can run out of batteries.

iOS without storyboard

Why?

Programmatically/Code or NIB based layouts are a much better fit for projects that use version control (see merge conflicts) and make it much easier to reuse views. If you are deciding not to use storyboards, you will need to manually set your application window to your desired UIWindow

Prerequisites:

– Delete Main Interface from Deployment Info Settings

– Delete the Main.storyboard file

How to: set up a iOS project without storyboard

Step 1: Create a UIWindow with the frame using the bounds of the UIScreen

UIWindow(frame: UIScreen.main.bounds)

Step 2: Assign this to the AppDelegate window property

window = ...

Step 3: Make the window “key” and “visible” 

window?.makeKeyAndVisible

Step 4: Set the window `rootViewController` to the VC of your choice

window?.rootViewController = ...

Code: link

Forgetting to set translatesAutoresizingMaskIntoConstraints to false

UIKit on iOS is great! There are tons of tools and often this can supercharge your productivity for getting a prototype out into the world.

Additionally, working with AutoLayout programmatically can be great if you avoid these rookie mistakes.

Rookie Mistake 1:

It hurts when you spend hours dealing with the rookie mistake of forgetting to set translatesAutoresizingMaskIntoConstraints to false on the view when setting constraints.

view.translatesAutoresizingMaskIntoConstraints = false

Rookie Mistake 2: 

Remember that you also have to also set your NSLayoutConstraint to true

Example:

yourView.centerXAnchor.constraint(equalTo:
  view.centerXAnchor).isActive = true

Solution:

This function allows you to program with wild abandon! If you use this function to set your constraints you never need to remember those pesky settings.

func setLayoutConstraints(
    view: UIView,
    constraints: [NSLayoutConstraint]) {
        view.translatesAutoresizingMaskIntoConstraints = false
        constraints.forEach({constraint in
            constraint.isActive = true
        })
}

Code found here, and more

*Update: Apple created a convenience method on NSLayoutConstraint called .activate that will set the isActive property to true. The new code would look like this:

func setLayoutConstraints(
    view: UIView,
    constraints: [NSLayoutConstraint]) {
        view.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate(constraints)
}

Delete files by filename with “find”

When you upload photos multiple times, the computer can start numbering the photos. IMG_A becomes IMG_A 1 and IMG_A 2 and IMG_A 3.

Using a wildcard * and specifying the ending space and number will help you select the files. For example:

Find all the files that end in "space"1.JPG

find -name '* 1.JPG'

* Have a look at the returned files to make sure you want to delete these

Find AND DELETE all the files that end in "space"1.JPG

find -name '* 1.JPG' -delete

gist

Setting environment variables

How to see and set your environment variables

Print all your current environment variables with 

$ printenv

See a the value for a specific variable with echo

$ printenv <YOUR_VARIABLE> or $ echo $<YOUR_VARIABLE>

For example:

$ printenv MY_API_KEY or $ echo $MY_API_KEY

How do I set the variable temporarily?

This will set your variable for ONLY your current shell session

$ export <YOUR_VARIABLE>=some-secret-pattern

You can also prepend values to a currently set variable

$ export <YOUR_VARIABLE>=some-secret-pattern:$<YOUR_VARIABLE>

This is why you see export PATH statements like this

export PATH=/usr/local/mysql/bin:$PATH

This is actually prepending /usr/local/mysql/bin to the existing PATH

How do I set the variable permanently?

You can run the same start up export command with every shell session if you put this in your .bash_profile

export <YOUR_VARIABLE>=some-secret-pattern

* Make sure you source your bash_profile to see the changes

$ source ~/.bash_profile

How do I see it in my code?

Using your node shell:

node> console.log(process.env)

Using your python shell

python> import os; print os.environ

Postgres tutorial – installing with brew + basics

Step 1: Install postgres

brew install postgres

Step 2: Start postgres server

brew services start postgresql

Step 3: Create a database

Lets call our database “book”

$ createdb book

Step 4: open the psql shell

List all databases in terminal with: $ psql --list

Adding the name of the db after the command psql will open the shell to that db

$ psql book

Your psql shell has different command. For the rest of the article, we will be using the psql shell.

List your databases in psql shell with: \l

* When checking the docs make sure you check know your postgres version with: select version();

Step 5: Create a new table

list your current database tables with: \dt

Create format:

CREATE TABLE <table_name> (<field_name>, <field_type>);

Lets create fields for “body”, “date” and “code”:

CREATE TABLE dids (body text, date timestamp, code text);

Inspect your table schema with: \d <table_name>, e.g. \d dids

Step 6: Add some table rows

Remember: SINGLE QUOTES ONLY and remember the ending semi colon

INSERT INTO dids (body, date)

  VALUES ('paired with Corey', NOW());

INSERT INTO dids (body, date)

  VALUES ('remembered that SQL is SINGLE QUOTES ONLY', NOW());

 

OOPS… – we realize here that our table does not have a primary key

Step 7: Alter your table columns (Schema migration)

Your tables will likely evolve throughout time – you may want to add fields to you table, or like above, we forget to add a primary key.

Add a column for “primary key” that auto increments

ALTER TABLE dids ADD COLUMN id serial primary key;

look at the table schema with: \d <table_name>

Step 8: Query your new database!

select * from dids

 

Installed with:

Homebrew 1.7.1

postgres (PostgreSQL) 10.4

Heroku: Node, Express, PostgreSQL Setup

Step 0: Have an app

Create an empty app if you dont have one

Create a folder, cd into it and initialize your git repo.

$ mkdir <app_name>; cd <app_name>; git init

Step 1: Install Heroku

Install the heroku cli with homebrew

$ brew install heroku/brew/heroku

Check your heroku installation: 

$ heroku --version

Note: heroku will check for the latest version every* time you run the command

Check what apps you have already created:

$ heroku apps

Step 2: Create a new named heroku app

$ heroku create <app_name>

If you run this command with the <app_name> heroku will choose a new random name for you.

In the picture above, https://theptrk.herokuapp.com is the new url for your blank app.

* this is the default site for your new app that sends a 502 HTTP code

Check that your app has been created

$ heroku apps

Step 3: Initialize your app to your heroku git url*

* If you ran heroku create in your app directly this step will be done automatically.

Check this by checking for a remote named heroku

$ git remote -v

If you dont see heroku, continue with this step.

“””With Github you might be used to using the word origin to mean your Github url, but the convention for heroku is to name this remote “heroku”. Note that this remote name is completely arbitrary and has nothing to do with the platform or url or anything.”””

Use git remote --verbose to check if you have any remote urls set up. There should be none

Get your apps “info” with info

$ heroku info <app_name>

With your git url add your remote:

$ git remote add heroku <git_url>

$ git push --set-upstream heroku master

* Notice that once you set this and push, you no longer need to specify the --app=<app_name>

** Note that heroku commands return different things depending on where you are.

 

Step 4: Set up node.js, install express.js

Create a package.json 

This file will be used by node/npm to indicate meta data, dependencies and other project level info

$ npm init

Install express.js

$ npm install express --save

Set the node version package.json to the one on your local machine.

You can check your local version with $ node --version

"engines": {
   // use your local version to stay consistent
   // if you want to push a newer node version, update your local node version
   // use nvm for the best way to handle local node versions
  "node": "10.6.0"
},

Create a “start” script

This is the script which is run whenever the command npm start is run.

Heroku will use this “start’ script as the default script if no Procfile is found.

"scripts": {
  "start": "node index.js"
}

curl express hello world (link)

curl -L https://bit.ly/express-hello-world > index.js

Run this server locally with 

$ heroku local web or $ npm start

Check out your website at http://localhost:5000/

At this point, you can git push heroku master

Step 5: Installing PostgreSQL instance for your app

Postgres instances are created and assigned to individual apps as “add-ons”.

Use this command to see all your existing add-ons.

$ heroku addons

** Note that heroku addons performs differently depending on where you are. If heroku recognizes that you are in a heroku app, it will only show you the add-ons for only that app. cd to a directory that is not a heroku app (say your home directory) and heroku will show you all add-ons for your account.

Create your PostgreSQL instance:

$ heroku addons:create heroku-postgresql:hobby-dev --app=<app_name>

Get more info with: $ heroku pg:info*

* if you navigated to a different directory, you may need to specify the app like this heroku pg:info --app theptrk

Congrats! You now have a heroku app instance and PostgreSQL instance.

Connecting to your PostgreSQL instance:

If you want to connect your app to your db, note that heroku automatically created a DATABASE_URL config variable for you. Type heroku config to see your current config variables. You can access this variable with process.env.DATABASE_URL in your application code.

Python Versions, Modules, Homebrew, pyenv

Step 1: Meet your default python

You are on Mac OS. When you run python in your terminal you see this. You have Python 2.7.10.

This is your default python. You can do things like add 8+8 or print things with print 12345

Step 2: Meet your modules

From your interpreter you can see your available modules by asking for “help”

> help("modules)"

Note that you have a bunch of modules – including “antigravity”!!! Try it!

> import antigravity

But where are these modules?

For this you need to import the “sys” module – which gives you access to the “system” – and print your “path” – which will print *most* of the folders that python will search for your modules.

import sys

print(sys.path)

* Note: if you ls into any of these folders, you will find a bunch of modules

Wait, every tutorial and most companies now uses Python version 3x

Most tutorials will tell you to brew install python to get the latest version of python.

Brew install walkthrough

the main job of brew is to make it easier to install packages to your mac

Step 1: download Homebrew

brew hosts its package information here as “formulae“. (get it? a brew formula?)

*Note that the python package is version 3.70 as of today.

This entire list is simply a list of packages with additional information including where to download it.

So what happens when I run brew install?

When you run the command, brew will look for the package in the formulae list and run the installation script for the package.

Brew installs *all* packages into its own directory at  /usr/local/Cellar .

Take a look with $ ls /usr/local/Cellar.

After installation, brew creates a symlink which is basically a shortcut that will allow your system to run the new command

Step 2: $ brew install python --verbose

* Note this line that symlinks Cellar/python/3.7.0/bin/python3 with python3

 

Wait, not all libraries use the latest version of python.

As of today, tensorflow DOES NOT support version 3.7. Can I downgrade my python version with brew?

Well, not easily… if you already have the older version downloaded, you can run brew switch python #.#.

But if you don’t have it downloaded, you’ll need to revert brew and do unrecommended stuff.

So how do I juggle versions of python?

pyenv walkthrough

The main job of pyenv is to manage which version of python you prefer to run.

How?

pyenv prepends a directory to your $PATH variable and hijacks every python or pip command you run. Then it tries to find your “preferred” python version to run.

How does it know my preferred version?

pyenv will first check the PYENV_VERSION environment variable (if set), then will move onto finding a .python-version file in the current directory, then look in the parent directory, then that parents directory, all the way up to the root. If it doesn’t find that file, it will search for a $(pyenv root)/version file and if it doesn’t find that, it will simply use your “system” python.

Step 1: brew install pyenv

Step 2: add the pyenv init command to your .bash_profile with this command

$ echo -e 'if command -v pyenv 1>/dev/null 2>&1; then\n eval "$(pyenv init -)"\nfi' >> ~/.bash_profile

Step 3: run your bash profile to make sure the changes propagate

source ~/.bash_profile

Now, if you run python you will see that you are still on version 2.7.10 (or whatever your system python was from the start). This is because you have not yet set your preferred python anywhere else, and the search landed on your system python.

Use pyenv install --list to list all available python versions

Step 4: install a version of python that works with your favorite library

$ pyenv install 3.5.5

* I’m choosing 3.5.5 which I believe is the latest compatible with tensorflow

Step 5: create a .python-version file in your project

$ echo 3.5.5 > .python-version

Step 6: run python

$ python

 

Bonus Points:

You will eventually want to manage your package versions

Step 1: create a virtual environment in a directory we’ll call env

Note: env is arbitrary but a good convention – a folder called env will be created where you run this command

$ virtualenv env -p `pyenv which python`

If you want to inherit from globally install packages, use this flag

$ virtualenv env --system-site-packages 

Step 2: activate your environment 

$ source env/bin/activate

Now, anytime you run pip install <anything> all of your packages will be downloaded into your new env folder without being installed in your global python PATH.

Step 3: pip install to your hearts desire

pip install --upgrade tensorflow

Levels of installing python

This is an opinionated route towards python management. Every computer may have its own set up.

Level 0: “I just want to play with python”

Method 1: Use and online REPL like this: https://repl.it/languages/python

Level 1: “I want python on my computer”

Download brew, use brew to download the latest version of python and go crazy.

$ brew install python

Level 2: “I want to manage python packages for a project”

Use virtualenv to create virtually separated environments for each of your projects. Make sure to “freeze” your requirements to a file so you record every version number of every downloaded package.

(Optional): use virtualenv-wrapper to manage all the virtualenv‘s you will eventually create

Level 3: “I need to manage python versions now”

Use pyenv to manage python versions per project and check this into version control. pyenv uses a .python-version file in your project to determine which python to use for the project.

virtualenv can still be used to manage package versions

Optional: use pyenv-virtualenv which is a pyenv plugin to “automate” the creation of virtualenv‘s