Our website is made possible by displaying online advertisements to our visitors. Please consider supporting us by disabling your ad blocker.

Webinar Series: Building A CEA2N And NativeScript Application

TwitterFacebookRedditLinkedInHacker News

Today I have finished the final episode of a five-part webinar series on the subject of Couchbase, Express Framework, Angular, and Node.js (CEA2N) application development. This webinar series has been going on for the past five weeks where each week I covered a new topic relative to the stack leading up to a NativeScript mobile application.

Each episode of this webinar was recorded and can be viewed for free here. This is some premium content!

An episode breakdown and project source code can be seen below.

Bootstrapping a Node.js Application with NoSQL

In this episode we get familiar with what we’re tying to build and the tooling involved. Although I am not personally using Docker in the webinar series, my co-presenter, Todd Greenstein, demonstrates how to get Couchbase Server up and running with Docker.

After we get Couchbase up and running, I walk through pretty much line by line, what is involved to get a Node.js application up and running. This includes obtaining project dependencies and defining the API endpoints that will be used within our application and future episodes.

Back-end Application Logic and Data Modeling

In this episode I go over the application data model and how to work with this data using an ODM tool similar to Mongoose called Ottoman. In case you’ve never used a NoSQL database, we modeled our data with referrals so that it closely resembles that of a relational database such as MySQL or Oracle.

Each of the API endpoints that were created in the previous episode get filled with Ottoman queries that let us create and get our application data.

In addition to Ottoman queries we also see how to accept file uploads via the Multer middleware for Node.js.

Building a Responsive Front-end with Bootstrap and Angular

In this episode we change things up a bit. Instead of using JavaScript with back-end code that interfaces with the database I go through the process of creating a front-end Angular application that makes requests against our Node.js back-end.

The Angular portion of this application uses TypeScript which is a superset of JavaScript. This allows us to use type definitions instead of the chaos that JavaScript brings us with every variable being var instead of say int or string.

The front-end is minimal when it comes to logic development as most of the crunching is done server side. The front-end is only meant to pass data around and display it on the screen.

Built-in URL Shortening and Permalinking

In this episode we add read-only mode accessibly through a permalinks. This means that when a user accesses the shared permalink they can view all the content of a particular task or project, but make no changes.

In addition to the permalinking we go over creating short minified URLs similar to that of Bit.ly or TinyURL.

This episode covers changes to both the back-end Node.js code and front-end Angular code.

Extending the Stack with a NativeScript Mobile Application

In this episode, the final episode, I strayed from the CEA2N application by building a new front-end. The front-end being a mobile NativeScript application that works for both iOS and Android.

If you’re unfamiliar with NativeScript, it is an awesome mobile framework that lets you build native cross platform apps with JavaScript. Unlike other frameworks such as Apache Cordova, NativeScript does not use the platform WebView making them native.

This mobile application consumes the data from our CEA2N web application via HTTP requests against our API endpoints.

Conclusion

I’d like to think my webinar series on full stack application development using Couchbase NoSQL, Express Framework, Angular, Node.js, and NativeScript was very thorough.

In it we walked through creating a crude version of what you might find in Jira or SafetyCulture. The full source code to the CEA2N web application can be found for free on GitHub here, and the full source code to the NativeScript mobile application can be found for free on GitHub here.

Again, this webinar series and everything in it is free and open source.

Nic Raboy

Nic Raboy

Nic Raboy is an advocate of modern web and mobile development technologies. He has experience in C#, JavaScript, Golang and a variety of frameworks such as Angular, NativeScript, and Unity. Nic writes about his development experiences related to making web and mobile development easier to understand.