Rails ActiveRecord: Get last records

Do you want to get the last few records on a database table using the Rails ActiveRecord? Here’s a simple way to do it:

Get the last record

Grower.last
#<Grower:0x007fdf8e55de10
 id: 713,
 name: "Diamondback",
 created_at: Tue, 06 Mar 2018 03:16:09 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:09 EST -05:00>

Get the last few records

Grower.last(5)
[#<Grower:0x007fdf917e7ed0
 id: 709,
 name: "Crossbones",
 created_at: Tue, 06 Mar 2018 03:16:09 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:09 EST -05:00>,
#<Grower:0x007fdf99a50070
 id: 710,
 name: "Winter Soldier",
 created_at: Tue, 06 Mar 2018 03:16:19 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:19 EST -05:00>,
#<Grower:0x007fdf99a501b0
 id: 711,
 name: "Punisher",
 created_at: Tue, 06 Mar 2018 03:16:29 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:29 EST -05:00>,
#<Grower:0x007fdf99a502f0
 id: 712,
 name: "TaskMaster",
 created_at: Tue, 06 Mar 2018 03:16:30 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:30 EST -05:00>,
#<Grower:0x007fdf99a52de8
 id: 713,
 name: "Diamondback",
 created_at: Tue, 06 Mar 2018 03:16:39 EST -05:00,
 updated_at: Tue, 06 Mar 2018 03:16:39 EST -05:00>]

Easy Peezy!

 Heroku: How to Restore Database dump

Restore database to local database.

Remember that your database should already exist.

pg_restore --clean --dbname=database_name --username=postgres1 ~/Downloads/dump

Prerequites

If you can’t remember how to create the backup, here’s a simple script

Create the backup

heroku pg:backups:capture -a appname
Starting backup of postgresql-acute-52332... done

Use Ctrl-C at any time to stop monitoring progress; the backup will continue running.
Use heroku pg:backups:info to check progress.
Stop a running backup with heroku pg:backups:cancel.

Backing up DATABASE to b117... done

Download the backup

You will need to get the url of the backup you just created. Here is the script to retrieve the url of your backup. You can just paste this on to your browser address bar.

heroku pg:backups public-url b117 -a appname

Done!

 Sass Cheatsheet

Variables

$white: #FFF;

body {
  color: $white;
}

Mixins

Example 1

@mixin font-size($times) {
  font-size: $times * 1.2px;
}

.highlight {
  @include font-size(3);
}

Example 2

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

.box {
  @include border-radius(10px);
}

Extends

%button {
  display: inline-block;
  margin-bottom: 0;
  font-weight: normal;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  background-image: none;
  border: 1px solid transparent;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  border-radius: 4px;
}

.white-button {
   @extend %button;
  background-color: #FFF;
}

.green-button {
   @extend %button;
  background-color: #00FF00;
}

 ReactJS: JSX Patterns for New React Developers

I’ve been working with ReactJS for a while now and here are a few things I’ve known that makes it easier for new ReactJS developers to work with ReactJS.

1. Lists

  render() {
    const { taskItems } = this.props;
    return taskItems.map((taskItem) => {
      return (
        <div key={taskItem.id}>
          <TaskItem
            taskItem={taskItem}/>
        </div>
      );
    });
  }

2. Shortcut validation and render

render() {
  {hasContent(taskItems) && <TaskItemsModal />
}

3. Ternary conditions

render() {
  {hasContent(taskItems)
    ? <TaskItemsModal
        showModal={this.state.showModal}
        onHide={this.closeModal}
        taskItems={taskItems} />
    : ""}
}

4. Transferring props

<Parent value="honesty" />

class Parent extends React.Component {
  render () {
    return <Child {...this.props} />
  }
}

5. Managing States

Initializing state

constructor(props) {
  super(props)
  this.state = {
    name: "Eric"
  }
}

Setting state

this.setState({ name: 'Nick' })

Using the state

render () {
  const { name } = this.state;
}

Default State

class People extends React.Component {
  constructor (props) {
    super(props)
    this.state = { loading: false }
  }
}

See: ReactJS States

6. ReactJS synthetic events

class UserForm extends React.Component {
  constructor() {
    this.onChange = this.onChange.bind(this);
    this.state = {
      value: ''
    }
  }

  onChange (event) {
    this.setState({ value: event.target.value })
  }

  render () {
    <input type="text"
        value={this.state.value}
        onChange={this.onChange} />
  }
}

Reference: ReactJS Events