Crash course with Parse Server for Telerik Platform developers by SashiDo

Marian Ignev

This blog post is aimed at showing you how to navigate your data in the SashiDo Dashboard and use the JavaScript SDK to perform the most commonly used operations while building a mobile application.

For this purpose we will be using an already existing set of example data - the Telerik Friends Sample App. If you are not familiar, such an example app can be created by navigating to a new application in Telerik Platform -> Data and clicking the Enable and use sample data button. The respective frontend code is available on GitHub. For simplicity's sake the examples below will be simplified to include only the most relevant bits and pieces of the process.

Vocabulary

Before proceeding, you should know how some of the most common terms, fields and features of Telerik Platform Backend Services translate to Parse Server.

Fields

Additionally all fields casing is transformed from pascal case to lower camel case to conform with the Parse Server and JavaScript conventions. E.g. the field CommentsCount is transformed to commentsCount.

Features
Cloud Code

Dashboard navigation 101

This is how our test application's structure looks like in Telerik Platform:

platform

After migrating it to SashiDo we are presented with the following information in the SashiDo Dashboard:

sashido

On the left, you can see your classes and on the right the respective objects, with their relations, images and fields translated to their respective Parse Server alternatives. If you are curious in more details what and how is migrated, and what you would have to do manually, refer to the blog post Checklist for successful migration.

First steps

Alrighty, we have migrated the data, but our web application is still using Telerik Platform. Let's get through the hurdles and differences you might experience while first switching from Everlive's JS SDK to Parse's JS SDK. Each example will build up on top of the previous ones, so keep that in mind.

You can always refer to the Parse Docs where every functionality is explained in details.

Initialization

With Everlive you need to supply your AppID.

const Everlive = require('everlive-sdk');
const everlive = new Everlive('c9o5u3p9j4h9o5bx');

SashiDo requires your AppID, JavaScriptKey and ServerURL. Both can be found in AppSettings -> Security & Keys.

const Parse = require('parse');
Parse.initialize('17joQ7Azu9O1mTKdntp8h3IndS6h4VUDKFbNN5W3');
Parse.javaScriptKey = 'CsgJs1v0Dhw3cpeKmtVZL2PRKUI6dUbDbRQS5U4W';
Parse.serverURL = 'https://pg-app-r1q3oghvrb1q6ys6qev81p5ccp3sj2.scalabl.cloud/1/';

Authentication

The gateway to every application is its login/registration. In our Friends app, only registered users can create new Activities.

Telerik Platform:

const username = 'my_username';
const password = 'super_secret_password';

//register
everlive.users
    .register(username, password, {
        Email: 'my_email@sashido.io'
    })
    .then(() => console.log('registered!'));

//login
everlive.authentication
    .login(username, password)
    .then(() => console.log('logged in!'));

Parse:

const username = 'my_username';
const password = 'super_secret_password';

//register
const user = new Parse.User();
user.set('username', username);
user.set('password', password);
user.set('email', 'my_email@sashido.io');
user.signUp().then(() => console.log('registered!'));

//login
Parse.User.logIn(username, password).then(() => console.log('logged in!'));

Reading Activities

After we are logged into our application it's only natural to read some activities. The activities are something like the posts in your Facebook feed.

Telerik Platform:

const Activities = everlive.data('Activities');

Activities.get()
    .then(activities =>
        activities.result.map(activity => ({
            id: activity.Id,
            text: activity.Text
        }))
    )
    .then(activities => console.log(activities));

Parse:

const Activities = Parse.Object.extend('Activities');
const activitiesQuery = new Parse.Query(Activities);
activitiesQuery
    .find()
    .then(activities =>
        activities.map(activity => ({
            id: activity.id,
            text: activity.get('text')
        }))
    )
    .then(activities => console.log(activities));

Both will print the following:

[
    {
        id: "334cda51-b336-11e7-b6af-eddd2fe7d355",
        text:
            "It is finally time for graduation! Good job everyone, we made it."
    },
    {
        id: "334cda52-b336-11e7-b6af-eddd2fe7d355",
        text: "The most amazing sunset I have ever seen at Phuket, Thailand"
    }
]

Reading the comments for an Activity

In both platforms the comments have a relation. To their respective parent activity.

Here's how we can find the comments for the first activity in Telerik Platform:

const oneQuery = new Everlive.Query();
oneQuery.take(1);

Activities.get(oneQuery)
    .then(result => result.result[0])
    .then(firstActivity => {
        const query = new Everlive.Query();
        query.where().eq('ActivityId', firstActivity.Id);

        const Comments = everlive.data('Comments');
        Comments.get(query)
            .then(comments =>
                comments.result.map(comment => ({
                    comment: comment.Comment
                }))
            )
            .then(comments => console.log(comments));
    });

And in Parse:

const activitiesQuery = new Parse.Query(Activities);
activitiesQuery.first().then(firstActivity => {
    const Comments = Parse.Object.extend('Comments');
    const query = new Parse.Query(Comments);
    query.equalTo('activityId', firstActivity);

    query
        .find()
        .then(comments =>
            comments.map(comment => ({
                comment: comment.get('comment')
            }))
        )
        .then(comments => console.log(comments));
});

The result would be:

[
    {
        id: "3810cb01-b336-11e7-b6af-eddd2fe7d355",
        comment: "Thanks :)"
    },
    {
        id: "3810cb00-b336-11e7-b6af-eddd2fe7d355",
        comment: "Congratulations!"
    }
]

Creating an activity

Let's close the cycle by creating an activity. When creating an activity we need a Picture, Text and UserId of the creator.

For simplicity's sake we will skip the boilerplate code of getting a base64 of the picture we will be uploading. More on the topic you can find in the Parse Docs about files.

Telerik Platform:

const file = {
    Filename: 'picture.png',
    ContentType: 'image/png',
    base64: 'some-base-64'
};

everlive.users.currentUser().then(user => {
    return everlive.files
        .create(file)
        .then(response => {
            return Activities.create({
                Text: 'new activity!',
                UserId: user.Id,
                Picture: response.result.Id
            });
        })
        .then(() => console.log('activity saved!'));
});

The difference with Parse is that we have to set the acl so that only our user can edit the activity and anybody, including unregistered users, can read it.

const picture = new Parse.File(
    'picture.png',
    { base64: 'some-base-64' },
    'image/png'
);
picture
    .save()
    .then(() => {
        const currentUser = Parse.User.current();

        const activityACL = new Parse.ACL(currentUser);
        activityACL.setPublicReadAccess(true);

        const newActivity = new Activities();
        newActivity.set('text', 'new activity!');
        newActivity.set('picture', picture);
        newActivity.set('userId', currentUser);
        newActivity.setACL(activityACL);

        return newActivity.save();
    })
    .then(() => console.log('activity saved!'));

Fin

After going through these basic steps, you now know what your data will look like when it is migrated to SashiDo, where to find it, how to query it and how to create more data.

Make sure not to miss on our other blog posts, such as:

Happy Migration!

Marian Ignev

Managing Director of CloudStrap & SashiDo. Passionate Software Engineer & Visionary. Make things happen! Love to communicate with bright creative minds!

Find answers to all your questions

Our Frequently Asked Questions section is here to help.







Latests news

How to make your Mobile Application GDPR Ready

At SashiDo we certainly care about our customers and we strive to be up-to-date on the horizon of the novelties coming up. We’re all working on GDPR these days and we want to help people understand what it is. What does GDPR mean? In February we announced that GDPR is coming and SashiDo.io is getting ready and now we will be more specific on how to make sure your mobile app is prepared for the upcoming changes in the European Union region.

Read More

SashiDo Acquires Octobas

SashiDo is pleased to announce its recent acquisition of all the assets of Octobas.com, a robust and scalable backend for mobile and web apps based on Parse Open Source. For the past 2 years our mission has been to become a leading Parse Server hosting provider in the mobile and web apps development world as well as to continue improving our service, launching new features and providing quality and security to our customers.

Read More