Integrating Firebase Cloud Functions In Badgeyay

Badgeyay is an open source project developed by FOSSASIA Community for generating badges for conferences and events. The Project is divided into two parts frontend, which is in ember, and backend, which is in flask. Backend uses firebase admin SDK (Python) and Frontend uses firebase javascript client with emberfire wrapper for ember. Whenever an user signs up on the website, database listener that is attached to to the Model gets triggered and uses flask-mail for sending welcome mail to the user and in case of email and password signup, verification mail as well. Problem is sending mail using libraries is a synchronous process and takes a lot of processing on the server. We can use messaging queues like RabbitMQ and Redis but that will be burden as server cost will increase. The workaround is to remove the code from the server and create a firebase cloud function for the same task. Firebase cloud functions lets you run backend code on the cloud and can be triggered with HTTP events or listen for the events on the cloud, like user registration. Procedure Firebase uses our Gmail ID for login, so make sure to have a Gmail ID and on the first sight we will be greeted with Firebase console, where we can see our created or imported firebase apps. Create the app by clicking on the Add Project Icon and write the name of the application (e.g. Test Application) and select the region, in my case it is India. Firebase will automatically generated an application ID for the app. Click on Create Project to complete creation of project After Completion, click on the project to enter into the project. You will be greeted with an overview saying to integrate firebase with your project. We will click on the Add Firebase to web App and save the config as JSON in a file as clientKey.json for later use. Now we need to install the firebase tools on our local machine so for that execute npm i -g firebase-tools Now login from the CLI so that firebase gets token for the Gmail ID of the user and can access the firebase account of that Gmail ID. firebase login After giving permissions to the firebase CLI from your Gmail account in the new tab opened in browser, create a folder named cloud_functions in the project directory and in that execute firebase init Select only functions from the list of options by pressing space. After this select the project from the list where you want to use the cloud function. You can skip the step if you later want to add the cloud function to project by selecting don’t setup a default project and can later be used by command firebase use --add Choose the language of choice If you want, you can enforce eslint on the project and after this the cloud function is set up and the directory structure looks as follows. We will write our cloud function in index.js. So let’s take…

Continue ReadingIntegrating Firebase Cloud Functions In Badgeyay

Integrating Firebase Cloud Functions In Badgeyay

Badgeyay is an open source project developed by FOSSASIA Community for generating badges for conferences and events. The Project is divided into two parts frontend, which is in ember, and backend, which is in flask. Backend uses firebase admin SDK (Python) and Frontend uses firebase javascript client with emberfire wrapper for ember. Whenever an user signs up on the website, database listener that is attached to to the Model gets triggered and uses flask-mail for sending welcome mail to the user and in case of email and password signup, verification mail as well. Problem is sending mail using libraries is a synchronous process and takes a lot of processing on the server. We can use messaging queues like RabbitMQ and Redis but that will be burden as server cost will increase. The workaround is to remove the code from the server and create a firebase cloud function for the same task. Firebase cloud functions lets you run backend code on the cloud and can be triggered with HTTP events or listen for the events on the cloud, like user registration. Procedure Firebase uses our Gmail ID for login, so make sure to have a Gmail ID and on the first sight we will be greeted with Firebase console, where we can see our created or imported firebase apps. Create the app by clicking on the Add Project Icon and write the name of the application (e.g. Test Application) and select the region, in my case it is India. Firebase will automatically generated an application ID for the app. Click on Create Project to complete creation of project After Completion, click on the project to enter into the project. You will be greeted with an overview saying to integrate firebase with your project. We will click on the Add Firebase to web App and save the config as JSON in a file as clientKey.json for later use. Now we need to install the firebase tools on our local machine so for that execute npm i -g firebase-tools   Now login from the CLI so that firebase gets token for the Gmail ID of the user and can access the firebase account of that Gmail ID. firebase login   After giving permissions to the firebase CLI from your Gmail account in the new tab opened in browser, create a folder named cloud_functions in the project directory and in that execute firebase init   Select only functions from the list of options by pressing space. After this select the project from the list where you want to use the cloud function. You can skip the step if you later want to add the cloud function to project by selecting don’t setup a default project and can later be used by command firebase use --add Choose the language of choice If you want, you can enforce eslint on the project and after this the cloud function is set up and the directory structure looks as follows. We will write our cloud function in index.js.…

Continue ReadingIntegrating Firebase Cloud Functions In Badgeyay

Using compression middleware in Node/Express

If you're using ExpressJS to host your server, there's a small performance tweak that you can do (works on universally on any kind of server - HTML templates to JSON REST APIs to image servers) - which is to enable GZIP compression. The changed required to do it should be very simple. First install the compression npm package npm install --save compression In you app.js (or wherever you start your express server), modify the code to include the compression middleware like this var express = require('express); var app = express(); var compression = require('compression'); app.use(compression()); // Rest of your app code // app.get (endpoint, callback) // app.listen(port, callback) This should easily reduce page loads time to the order of 15-20%. For example, page load before compression middleware added   And Page load time after compression is added

Continue ReadingUsing compression middleware in Node/Express

Handling file uploading in HTML5 and Express

The Open Event Webapp Generator has a pure HTML front end form, and Express based backend.   We needed an option where users can upload their own JSON files to create a schedule page for it. On the HTML form that's easy. As you can see here we simple add input tags with type="file" <input type="file" name="sponsorfile" id="sponsorfile"> In our express app, we need to use multer to be able to handle file uploads. We create a middleware called uploadedFiles, and pass the middleware to the get() block   var express = require('express'); var multer = require('multer'); var app = express(); var upload = multer({dest: 'uploads/'}); var uploadedFiles = upload.fields([ {name: 'speakerfile', maxCount: 1}, {name: 'sessionfile', maxCount: 1}, {name: 'trackfile', maxCount: 1}, {name: 'sponsorfile', maxCount: 1}, {name: 'eventfile', maxCount: 1}, {name: 'locationfile', maxCount: 1} ]); app.post('/live', uploadedFiles, function(req, res) { // req.files has the files // req.body has the POST body params }); }); Now we can access the files inside req.files (that will have a path to the temporary location of the file, you'll have to use some filesystem module to read the files)

Continue ReadingHandling file uploading in HTML5 and Express