Best way to implement a signup form with Ember and Rails

1

Hello,

I have to create an complete registration process for users. In rails, I usually use Devise. I have a rails api that is only responsible of the api. No view are produced by this application.

I seen this GitHub - simplabs/ember-simple-auth: A library for implementing authentication/authorization in Ember.js applications. and this https://github.com/simplabs/ember-simple-auth/tree/master/packages/ember-simple-auth-devise. It talks about authentication but not about registration.

Is there an existing solution or should I have to do it my self?

Thanks!

2

simple-auth handles session and authentication, not necessarily the “login” or “registration”.

What I usually do is create 2 forms that send AJAX requests with icajax and once they are successful, I use simple-auth’s authenticator & authorizer to handle the session.

3

You should treat user registration as simply creating another record in the store for the model and persisting this data to the Rails API.

Suppose you have the next User (the name of the model should correspond to your Rails user model) model:

// app/models/user.js
import DS from 'ember-data';

export default DS.Model.extend(  
  email: DS.attr('string'),  
  password: DS.attr('string')  
});

Then you would have a simple registration form in your Handlebars template:

// app/templates/signup.hbs
<form {{action 'createUser' on="submit"}}>
  {{input type="text" value=userEmail placeholder="Email"}}
  {{input type="password" value=userPassword placeholder="Password"}}
  <button type="submit">Sign up</button>
</form>

And in your controller implement the action to create a user.

// app/controllers/signup.js
import Ember from 'ember';
 
export default Ember.Controller.extend({
  actions: {
    createUser: function() {
      var email = this.get('userEmail');
      var password = this.get('userPassword');
       
      var user = this.store.createRecord('user', {
        email: email,
        password: password
      });

      user.save();
     }
   }
});

That’s it. You only need to implement an action in controller in Rails to handle the incoming POST data and saving it to the database. You mentioned that you’re using Devise, so it should be working by default then.

The registration process can be also rewritten to use Ember Component but this one is also a clean and easy solution.

4

I’m not sure if that’s wise, you are saving the password in the Ember.Store as plain text. You probably shouldn’t save any passwords in the front end of an app.

1 Like
5

Yes it might be good to send the password only and not keep it on the model and in return you get a generated token from the api backend which you can put in the LocalStorage, on the model or however you wanna handle it.

6

Sorry to bump old topic, but I am curious what best practice would be.

So, you can do Ajax post: example and you can do it via the store.

As stated above, you would save plain password in a store, but what about running store.unloadAll('user'); after saving our user?

Would that clean password saved in store?

(I feel like this would make cleaner code, than posting via AJAX)

3 Likes