Oct 15, 2018
Summer Internship with Sugar Labs (2018)
Before moving any further, I would like to thank each and every one who helped me directly and indirectly to complete this internship. But for this article, I will limit them to my mentors Hrishi Patel, Samson Goddy, Jaskirat Singh, Pericherla Seetaramaraju from Sugar Labs for guiding me through the whole process and for being so supportive throughout the Internship and especially Walter Bender from Sugar Labs for providing me this opportunity to do a Project for their Organisation.
This article is divided into following subsections:-
- Hitting it off with Sugar Labs
- About the Project, I did during the Internship Period
- Goals Achieved
- Coding Period
- Codebase
- Challenges faced
- Future Development
- Things I learned during the Internship
Hitting it off with Sugar Labs
It was February 2018 and I was looking forward to GSOC-2018 for the summer. I am a Web Developer, so I was looking for a Project that suits my interest. After going through some Projects and Organisation I came to know about the Sugar Labs through a Facebook post shared by an open source related page(don’t remember exactly) and after exploring the projects I decided to go with Sugar Labs. In between Hrishi Patel and Jaskirat singh helped me on IRC in exploring and moving further. The Project which I decided to go with was mentioned at the organisation’s wiki page like this
After a lot of discussion with Pericherla Seetaramaraju, Hrishi and Samson I prepared the Project Proposal (available here) meanwhile I was making some pull request to the other projects. Unfortunately this project did not got selected for GSOC-2018 but I did invested a lot of time in making the proposal and understanding the project, so I decided to ask the Walter if they can allow me to do this project by aside of gsoc and he responded so quickly to my mail and asked me to contact with the mentors assigned to this project and then Samson (one of the mentor’s) agreed and then I started doing the project.
one week or so Hrishi in the weekly meeting surprised me by saying that this project is going to convert in an Internship and hence my Internship started officially by 1 June 2018. It was decided for a three-month long Internship.
About the Project, I did during the Internship Period
Sugar Labs Social (v 1.0) is a platform for Sugar Developers, Volunteers, Teachers, Parents to unite at a single place and discuss, explore, create and share everything related to Sugar World :). It targets to bridge the gap between the developers and teachers /parents, brings them to a single place and motivates them to contribute to the Sugar World.
Sugar Labs Social (v 1.0) is a Django based webapp developed from scratch during the Internship. It uses PostgreSQL as a database and for the user facing layer of the application Django’s template engine is used with HTML, CSS, Javascript. Bootstrap 4.1 is used as a CSS and JS framework.
This app allows an user to signup/login and create their profile, write a blog, start a discussion/ conversation with the post feature, sort the posts/blogs with specific tags. User can explore all the projects going under sugar labs org can contribute in discussion using the specific discussion section of the project. Users will be able to download/setup the software available and reviews the same. A dedicated aslo section is available for the discussion purpose.
Screencast of the project is available here
Some major features that the Sugar Labs Social provides are:-
Email + google + github + facebook authentication
2. Dedicated User Profile
3. Blog
4. Posts
5. Tag filtering
6. Feed
7. projects | softwares | activities section
Goals Achieved
- Designed the UI
- Done the project setup
- Implemented Email and Social auth
- Added Blog and Post feature
- Integrated Commenting system
- Extended the Django user model for profile feature
- Added Software, Projects and Activities section
- Implemented Feed
- Implemented Tag Filtering
Coding Period
I did the project in a full swing during the month of June and July, but for some reason in the month of Aug it resulted in a downtime but thanks to the mentors who again helped me in getting up and motivated me to complete the project.
Yes, you read it right it took 130+ commits to complete this project :D
Codebase
Since this is an open source project you can find the whole source code here
Technology Stack Used
Python3, Django-2.1, HTML, CSS, JS, Bootstrap 4+, PostgreSQL
How to set up the Project?
- *Currently the setup guide is available only for Debian based OS users, will available soon for other OS users.
Project Architecture
Plugins/ Packages used
- Simple MDE: Used this open sourced markdown editor for Blogs editor.
- Django threaded-comments: This package is made on the top of the django comments used for commenting system in this project.
- Django taggit: Used for tags feature.
- Social auth app: For social authentication.
- Django crispy forms: For rendering the forms in smooth UI.
Structure
For every major feature I created different app this follows the Unix philosophy of, “Do one thing and do it well.” , with a focus on being small and modular, mirroring Django’s “loose coupling” design philosophy .
Challenges Faced
The First Challenge was to design UI:
Although I am quite proficient in Photoshop, but Designing the whole UI using PS could be a real pain So I had to find an alternative and then Adobe XD came as a rescue, a totally free application specially made to design UI
A Bad decision to go with Mongo-db and Django
A detailed description is available here
Struggled to add simplemde js markdown editor
What simplemde do is replace the textarea tag with their own text editor which helps in writing markdown formatted text and using python markdown plugin convert the markdown in HTML. But the problem was Django validate its form in backend and it was not validating markdown exported by their plugin. So I just stop validation with using novalidate tag in form tag.
Implementation of Feed
The problem with the data rendering is solved using the query set mentioned above. But the new problem was to make different UI designs for posts, blogs etc. So I designed my own filter which checks whether the data is for blog or normal post.
Future Development
- Responsiveness across the device with different size screen could be improved
- Better Typography for Blogs
- A better and reliable threaded commenting system replacement
- User following feature
- Integration of search bar
- Like, share and bookmark options
- Rest API of the App, So that Native application for different devices can be made
- Separate client side with server side (frontend using frontend framework i.e ReactJs)
- Live notifications etc
Things I learned during the Internship
- Collaborate with highly experienced people remotely.
- Learned to do quality research
- Learned to break the project into the modular form
- Effectively reading others Codebase
- How to manage the Codebase
- Making quick decisions
Overall It was an awesome experience interning with Sugar Labs and working with the mentors. :D
