SSH Tunneling

A SSH Tunnel allows you to send traffic to a remote machine through another machine.   I often use this to access instances on another network which my desktop can not see.  

Example:

Let's open a tunnel on our port 9009 which will reach port 443 on a remote machine
  • ssh -L 9009:localhost:443 root@192.168.252.10
    • This will open port 9009 on our local host and direct traffic on 9009 to port 443 on the remote machine 192.168.252.10

Generally I need to go further and use a remote machine as a gateway to reach another machine, so I'll open up a tunnel on the remote machine as well:

  • ssh -t -t -L 9009:localhost:9009 root@foo.example.com 'ssh -L 9009:localhost:443 root@192.168.252.10'
    • With this port 9009 on localhost will redirect to 9009 on foo.example.com which will redirect to 443 on 192.168.252.10

Editor Customizations

  • Atom
    • https://atom.io/
    • Enabling vim-mode
      • apm install vim-mode
      • apm install ex-mode
      • then restart Atom
    • Enable Preview Tabs
      • Packages -> Settings View -> Manage Packages 
        • Search 'tabs'
          • Click 'settings'
            • Enable 'Use Preview Tabs'

WebUI Frontend Components

Useful frontend components:

  • Perfect Scrollbar
    • http://noraesae.github.io/perfect-scrollbar/
    • ember-cli addon:  https://www.npmjs.com/package/ember-perfectscroll


Layout Tools:

  • http://bootstrapstudio.io/


Bootstrap Example Links:


Example Progress Step Bars:

Example flipping a box on click

Misc:

  • Online book:  Front-end Handbook
    • https://www.gitbook.com/book/frontendmasters/front-end-handbook/details

Ember.js Articles/Tutorials/Links

Collection of articles on ember.js that have helped me learn:

  • Ember Addons
    • http://www.emberaddons.com/
  • Explanation of 'Data Down Actions Up' pattern
    • https://emberway.io/ember-js-goodbye-mvc-part-1-21777ecfd708#.n3y620b1a
  • Ember.js Components
    • http://www.programwitherik.com/ember-js-components-examples/
  • Typeahead Component
    • https://github.com/aupac/ember-aupac-typeahead
  • Promise/RSVP articles
    • http://www.barelyknown.com/blog/2014/12/14/understanding-ember-data-and-rsvp-promise-chaining
  • Questions/Problems
    • Sub-components and actions not bubbling up automatically
      • http://discuss.emberjs.com/t/sub-component-action-not-bubbling-up/6739/7
    • Closure Actions
      • http://emberjs.com/blog/2015/06/12/ember-1-13-0-released.html#toc_closure-actions
        • How to call an action on a route using closure actions
          • http://stackoverflow.com/questions/31101296/how-to-call-an-action-on-a-route-using-closure-actions
    • What should a REST API return for ember-data
      • Helped me fix a problem with PUT/POST where I was returning plural in http-mocks, should have been singular.
      • http://discuss.emberjs.com/t/what-should-an-api-compatible-rest-server-return/779
    • Binding element attributes in a template
      • https://guides.emberjs.com/v2.2.0/templates/binding-element-attributes/
    • Examining a select box with Ember 2.0
      • http://balinterdi.com/2015/08/29/how-to-do-a-select-dropdown-in-ember-20.html
        • https://gist.github.com/rtablada/280778b093768172cf43
    • Bootstrap active links with <li active=true>{{link-to}}</li>
    • Scroll to top of page on each ember route
  • Components
  • General Ember Blogs
  • Conference Talks
    • EmberConf 2015 Opening Keynote
      • https://www.youtube.com/watch?v=o12-90Dm-Qs&feature=youtu.be&t=47m21s

  • Helpers:
    • Ember Truth Helpers (provides 'eq' helper)
      • https://github.com/jmurphyau/ember-truth-helpers

Notes:
  • What is Ember.K
    • http://ember.zone/what-the-hell-is-ember-k/ 
      • Making methods safe to call in the event that they might be undefined at the time of calling.
      • Providing hooks for subclasses to implement in a safe way.
      • Creating stand in action event handlers until you are ready to implement the necessary logic, and avoid Ember.js throwing an error.
  • Creating a closure action on a nested component
    • On the template
      • {{my-component saveAction=(action 'saveControllerAction')}}
        • Assumes 'saveControllerAction' is an action defined on the controller.
          • saveControllerAction() calls this.send('saveRouteAction', this.get('model'))
          • It's important the action name is different between controller and router, if they are same you run into a circular reference and will stack overflow.

Example creating a new rails api app

Notes from working with: https://devmynd.com/blog/2014-7-rails-ember-js-with-the-ember-cli-redux-part-1-the-api-and-cms-with-ruby-on-rails/
  1. Create new rails app 
    
rails new backend -T -d postgresql
cd backend
  2. Edit Gemfile and be sure the below is included 
    
gem "grape"
gem "grape-active_model_serializers"
gem "grape-swagger-rails"

group :development do
  gem "better_errors"
  gem "meta_request"
  gem "quiet_assets"
  gem "spring"
  gem "rails-erd"    # Generates a Entity Relationship Diagram
end

group :development, :test do
  gem "capybara"
  gem "capybara-screenshot"
  gem "database_cleaner"
  gem "factory_girl_rails"
  gem "faker"
  gem "poltergeist"
  gem "pry-nav"
  gem "pry-rails"
  gem "pry-stack_explorer"
  gem "pry-theme"
  gem "rspec-rails"
  gem "rubocop"
  gem "shoulda-matchers"
  gem "spring-commands-rspec"
  gem "annotate"  # Annotates model classes with comments of db fields
end
  3. Install the dependencies 
    
bundle install
  4. Edit credentials for database, config/database.yml
    5. 
default: &default                                                        
  adapter: postgresql                                                                  
  ....
  .... 
  host:  localhost                                                                       
  username: pguser                                                                    
  password: test
  5. Run some generators 
    
bundle exec rails generate rspec:install
bundle exec spring binstub --all
bundle exec rake db:create db:migrate db:seed

  6. 
bundle exec rails generate model contact first_name:string last_name:string email:string title:string

Example from original blog post:


References:

Creating a new ember-cli app with bootstrap

Creating a new ember-cli app with Bootstrap


Steps:

  1. Install ember-cli 
    
sudo dnf install nodejs npm
npm install -g bower
npm install -g phantomjs
npm install -g ember-cli
  2. Create new ember application 
    
ember new $NAME
cd $NAME
npm install
bower install
  3. Install 'bootstrap' 
    
bower install --save-dev bootstrap
  4. Add bootstrap dependency to Brocfile.js 
    
app.import('bower_components/bootstrap/dist/css/bootstrap.min.css');
app.import('bower_components/bootstrap/dist/js/bootstrap.min.js');