Skip to content

Instantly share code, notes, and snippets.

@yashLadha

yashLadha/[GSoC] [FOSSASIA] Work Product Submission For Badgeyay - yashLadha.md

Last active August 11, 2018 07:04
Show Gist options
  • Save yashLadha/49c7b2b5a02064f27a6fb04afc4da0de to your computer and use it in GitHub Desktop.
Save yashLadha/49c7b2b5a02064f27a6fb04afc4da0de to your computer and use it in GitHub Desktop.
Download ZIP
Work product submission for GSoC 2018 project
Raw
[GSoC] [FOSSASIA] Work Product Submission For Badgeyay - yashLadha.md

Google Summer of Code 2018 Work Product Submission

Student : Yash Ladha (@yashLadha)

Organisation : FOSSASIA

Project : Badgeyay as a complete service

Overview of Work Done

Integration of Firebase

  • Authentication : Emberfire is used as the official wrapper from firebase. We have used the emberfire for authentication and creates the user from frontend on firebase. The Response from the wrapper is sent to the backend API and then it gets persisted in the Postgresql database in backend.
  • Storage : We are using the firebase storage as a secondary to store the generate badges that can be accessible across different devices around the globe. The public bucket is used to serve the static generated badge.
  • Realtime database : This makes it accessible to provide realtime updates across devices. Due to lower latency and fast updates we have used it to log the activities by the cloud functions. These logs then later accessed by the flask server to perpare the payload sent to frontend.
  • Cloud functions : These are the functions that runs code according to evemts triggered on firebase or HTTPS requests. These are used to automatically send mails on listening to events like User Creation, node insertion at specific node in the realtime database.

Revamping frontend in Ember

Whole frontend is shifted from Flask template to EmberJS. Ember is a MVC frontend framework. Evry UI element is divided into individual components. This leads to improvement in maintainability of the components and customizability as well.

Chaining of actions and models have been created. Badges are generated through chaining of several actions in the createbadge controller which inturn depends on the models and responses received from other API calls. Template Helpers and conditional rendering of components have also been implemented.

Improvement in the REST API Endpoint

Whole Backend is refactored. Controllers contains the logic for the endpoints. Utility functions have been created for providing functions that are used across different controllers.

The whole API is designed to follow JSON API specification using marshmallow to serialize and desiralize models. Firebase Admin SDK is also created to support admin functionalities of firebase from the backend flask server.

Badge Size

Badges are generated through conversion of SVG to PDF. SVG is created in a tree like structure so that it can be iterated and ' parsed through XML parsers. System now has support for several badge sizes complying with the paper sizes.

Admin Section

Worked on creating the Admin functionality on the frontend. Admin Panel consists of tabs like Users, Permission, Messages, Badges, Modules, Settings.

These give a higher level interface to manage all the functionalities that are running on frontend and backend directly through the interface.

User can look into the statistics and can mutate the behaviour of UI Componnets directly from the Interface. User management portal is also there along with the interface to manage the deployed cloud functions directly from the admin interface.

Other Contributions

Other major contributiosn include:

  • Creating App Engine Deployment Config & Container Image
  • Setting up of production deployment on Github
  • Deployment of Firebase Cloud functions
  • Improving the look of Badge Creation Form
  • reviewing PRs and opening issues in other repositories of FOSSASIA
  • Preparing logic for extracting important information from Realtime database.
  • Persisting data in frontend
  • Correcting frontend production deployment on github pages.

Code

Badgeyay

Code Repository : https://github.com/fossasia/badgeyay

Project Link : http://badgeyay.com

Issues | Pull Request | Commits

Blogs

All the blog posts I wrote during the project are accessible at FOSSASIA's blog: https://blog.fossasia.org/author/yashLadha/

Scrums

All my scrums are present in here

Tweets

FOSSASIA Meetup

I have conducted three outreach events during the GSoC Period.

Facebook Events :

Twitter Posts :

Screenshots


Admin Index
Create Badges

Forgot Password
Index Page

Login Form
Admin Site Settings Page

System Reports
User Settings
---

Thanks FOSSASIA for providing such a learning opportunity.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment