Austin Story

Ruby, Rails and Javascript Blog

Powered by Genesis

Ubuntu 16.04 setup for Ruby on Rails, Postgres, NodeJs, ElasticSearch and Neo4j

May 14, 2016 By Austin Story Leave a Comment

POSTGRES

sudo apt-get update
sudo apt-get install postgresql postgresql-contrib

sudo -u postgres createuser –interactive
#name of role = yourLoggedInUserName
#super uesr? yes

Set permissions for local postgres access in pg_hba.conf
# will probalby be in /etc/postgresql/VERSIONNUMBER/main/pg_hba.conf

set all database administrative in peer column to ‘trust’ this allows you to login locally without security (i.e. don’t do this for production)

with the user you are logged in as, run these commands, for instance if you login as my_user_name
sudo su postgresql
psql
CREATE ROLE my_user_name WITH SUPERUSER;
ALTER ROLE my_user_name WITH CREATEDB;
ALTER ROLE my_user_name WITH LOGIN;

Add git SSH access
mkdir ~/.ssh
chmod 700 ~/.ssh
cd ~/.ssh
ssh-keygen -t rsa -C YOURNAME
cat id_rsa.pub

Copy what is displayed into your github/bitbucket to add new keys

install git
sudo apt-get install git

Install RVM
https://rvm.io/

Set RVM as function
copy this
[[ -s “$HOME/.rvm/scripts/rvm” ]] && source “$HOME/.rvm/scripts/rvm”
From: ~/.bash_profile file
To: ~/.bashrc file

Install Ruby
close and open a new terminal
rvm install 2.3.1

Set default ruby
rvm –default use 2.3.1

Install Java
sudo apt-get update
sudo apt-get install default-jdk

Install Elasticsearch
wget https://download.elastic.co/elasticsearch/elasticsearch/elasticsearch-2.3.2.deb
sudo dpkg -i elasticsearch-2.3.2.deb

Install Neo4j
wget -O – https://debian.neo4j.org/neotechnology.gpg.key | sudo apt-key add –
echo ‘deb http://debian.neo4j.org/repo stable/’ >/tmp/neo4j.list
sudo mv /tmp/neo4j.list /etc/apt/sources.list.d
sudo apt-get update
sudo apt-get install neo4j

Install Node version manager (NVM)
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.1/install.sh | bash
nvm install 6.1.0

LINK Rubymine properly
https://makandracards.com/makandra/879-install-rubymine-under-ubuntu

tar -xzf RubyMine-X.Y.Z.tar.gz
Make a directory for RubyMines:

mkdir -p ~/bin/rubymines/
mkdir -p ~/bin/rubymine/
Move the unpacked RubyMine folder to the desired destination:

mv ~/Downloads/RubyMine-X.Y.Z ~/bin/rubymines
Make a symlink:

ln -nfs ~/bin/rubymines/RubyMine-X.Y.Z ~/bin/rubymine

Postgress
sudo apt-get install lib-pqdev

image magick – rmagic
sudo apt-get install libmagickwand-dev

Filed Under: Integrations, Javascript, Ruby

What is Redux?

March 24, 2016 By Austin Story Leave a Comment

I have programmed almost completely in redux/react for 4 weeks now. It seems pretty awesome and I am bullish on it. It is the first time I have ever used a frontend framework on a project and considered replacing standard rails views with. Initially,I had a rough time with it due to the amount of hype around it. So i’m going to explain it the way I wish someone had explained it to me when i first started.

Redux is a Javascript Object that acts as Key/Value store (AKA store) with Strict, Immutable Publish Subscribe Updates (AKA actions)

Store – The main feature of redux is to store the state of your local web application in a single nested key/value store. So if you had a site where people login to store movies they have watched your store would probably look something like your backend database.

[javascript]
store: {
session: {}
user: {}
movies: {}
}
[/javascript]
After you login and visit a couple movies it could be something like

[javascript]
store: {
session: { apiKey: ‘1234’, expiresAt: ‘33999299’ }
user: { firstName: ‘Austin’, lastName: ‘Story’ }
movies: {
{ title: ‘The Matrix’ },
{ title: ‘Dale and Tucker vs Evil’ }
}
}
[/javascript]

Say WHAAAT! Yep. That is all the store is. It is a bunch of key value pairs. The keys are strings and the value are whatever you want. Normally the values are objects, hashes or arrays of objects but they could be numbers or strings.

Now here is where things start to get interesting. You tack on publish/subscribe as the SOLE way to update the store. In publish subscribe you have 2 concepts.

1. You publish messages to your application
2. An array of objects subscribe to those messages and do things based on what the messages are

The subscribers in redux are called ‘reducers’ and you get one reducer per key in your store. So in the above example we would have 3 reducers. sessionReducer, userReducer and MoviesReducer. Those reducers are the sole way to update the value of the key.

So, the sessionReducer is the only thing that can impact the session store which is
`session: { apiKey: ‘1234’, expiresAt: ‘33999299’ }`.

It makes it pretty simple to understand what is affecting the data on your frontend.

Now the publishes are performed by the store using a function on it called `dispatch`.

So a login action would look something like this.

1. Create a userReducer and a sessionReducer, configure redux to have a user and session key in the store.

2. When someone successfully authenticates to your app call `store.dispatch({ type: ‘USER_SUCCESSFULLY_LOGGED_IN, payload: apiData })`

3. In your userReducer and sessionReducer, listen for the message USER_SUCCESSFULLY_LOGGED_IN and when you get it, update the state with the data you care about in the apiData. In your movieReducer, you would ignore the user login message and just return your current state.

4. In the reducers, you never modify the state. Another way to say that, is the value that the key maps to is not changed, instead you either return a new value if you need to change it or you return the old one if the message that was passed in is not something you care about.

This strict updating to a new state provides us with a huge benefit when coupled with React. In react, you map your redux state to react components using react-redux package. So lets say in a profile screen you map to the user store and on a movie screen you map to the movies store. If the user adds another movie, only the movie store state will change, so the user component will not have to change.

I have really enjoyed my journey so far into redux. I am quite bullish on it and hope to keep posting as i learn new things that might help someone along the way.

Filed Under: React, Redux Tagged With: React, Redux

ES6 Javascript import

March 7, 2016 By Austin Story Leave a Comment

when doing imports in es6 you have two different ways

implicit
[code]
import React from ‘react’;
[/code]

this assigns the entire module react to the value of React. To access anything in it you have to do accessors like so

[code]
class Something extends React.Component
[/code]

You can also import specific libraries from modules and then access them directly by name.

[code]
import { Component } from ‘react’;

class Something extends Component;
[/code]

This syntax also allows you to do more interesting things like define a function in a file, import it and then assign that to a variable for use. Here is an example using a react-redux component function.

[code]
import React from ‘react’;
import { Sparklines, SparklinesLine } from ‘react-sparklines’;

export default (props) => {
return (
<div>
<Sparklines height={120} width={180} data={ props.data }>
<SparklinesLine color={props.color} />
</Sparklines>
</div>
);
}
[/code]

In another file i can now do this to import and use my function

[code]

import SparkChart from ‘../components/chart’;

//Other code, this would go in my render react function
<SparkChart data={temps} color="yellow" />
[/code]

Filed Under: ES6, Javascript Tagged With: ES6, Import, Javascript

  • « Previous Page
  • 1
  • 2
  • 3
  • 4
  • 5
  • Next Page »

Categories

  • AngularJS
  • Books
  • Devise
  • Elasticsearch
  • ES6
  • Information Security
  • Integrations
  • Javascript
  • Linux
  • Minitest
  • PhoneGap
  • Programming
  • React
  • Redux
  • Ruby
  • Ruby on Rails
  • Stripe
  • Testing
  • Theory
  • TypeScript
  • Uncategorized
  • Vue
  • Webpack