GSoC 2020 Blog Post (#2)
View Blog Post
I am 3 weeks into the official coding period and they have been great. A little background, I am working on the Frontend aspect of my project where I am using the ReactJS framework to build a UI for the EOS Feature Request web portal.
Last time I talked about working on a language toggling feature, which was successfully built. I used the useTranslation functionality provided by the 'react-i18next' package. This gave me a function that can be called to trigger the change in language. I created a dropdown menu with the available languages to do it. It required me to create separate files for the individual languages (basically all the text to be displayed in all the available languages). When a user triggers a change in language the application will change the file it is using to display the content, thereby achieving a change in the display language. Once this feature was completed and its PR got merged, I started working on creating a Navigation bar which will be used to access different pages/options in the web portal. I created the Navigation bar, applied the relevant styles and added the different functionalities that were decided. Also, since the web portal is going to be public (i.e. everyone can view it), I developed the navigation bar in such a manner that Non-Authenticated users can only see a subset of the options and Authenticated users have access to everything. Simultaneously, I was also working on creating the New Request page which will be shown only to the authenticated users where they can request a new feature. This involved creating a form with all the relevant fields that the user will have to fill up in order to make a new request. I am still working on this last feature.
I faced some problems initially while creating the navigation bar. The issue was regarding its position and responsiveness. Took some time and help but I was able to resolve all the issues and the corresponding PR got merged. I am stuck on a particular feature in the New Request page. A user will be allowed to attach media (images/videos) as a part of their feature request, and I am thinking what would be the best way to achieve that. Basically, working on answering these questions: What formats should be supported? How these files will be stored on the server? What kind of file choosing mechanism I should provide to the user? etc.
I'll wrap up with the New Request page functionality as soon as possible and then work on improving its UI based on inputs from the mentors and my project partner. Once, the entire New Request functionality is completed I will probably work on making sure that everything built is working properly and is inline with the expectations. This is to make sure that I come out of the first evaluation with a positive feedback.
Thanks for reading
Weekly Check In 2
View Blog Post
It has been about two weeks into the official coding period and I think they have been pretty productive. Previously I worked on setting up a few things that will enable me to toggle between different languages in my Frontend, so this last week I worked on implementing this feature across the Authentication module I was worked on before. Apart from this I worked on resolving a few UI issues present in my Frontend. These were minor issue relating to colouring and positions of different components. Majority of the last week was spent on designing what the pipeline for the portal will look like. This included creating a simple wireframe initially and then creating a Mock UI using AdobeXD. I along with my mentors and partner (Aditya Sharma) had a good discussion over these and I kept on incorporating all the suggestions.
I did face a few issues regarding positioning of a few elements but my mentor gave me a few suggestions and then I was able to sail through.
Right now, I am waiting for my PR with the language toggling feature to get approved. Also, once the design for the pipeline is finalised I will start working on creating the user dashboard.
GSoC 2020 Blog Post (#1)
View Blog Post
The coding period officially started last week and me and my partner Aditya Sharma began working on our project. Like I said earlier I was working on the Authentication module and that’s what I did. A design (which was created in AdobeXD) of what the expected end product should look like was given to me, which I used as a reference while writing the React code. I started with setting up a React application using the "create-react-app" bootstrap method. This was followed by adding a bunch of dependencies ranging from router requirements, axios method for backend communication, linting and formatting checkers etc. My partner had done this previously so he helped me in setting up all of these. Once the directory structure was set up I began working on the authentication module. As I mentioned in my last blog post I started working on the Authentication module in the community bonding period itself, so I had a basic version of the module ready. Main thing that I had to do now was to make the interface look like the one I received as a part of the design. This involved writing SASS (which is basically like CSS) for the different pages and components. I also spent a lot of time on making sure that my UI was responsive and adaptable on different screen sizes. I submitted a PR for the same which is currently being reviewed. Mentors have been very helpful and quick in their response towards my work. Their comments on the PR are insightful and I am working on resolving the issues pointed out by them.
I was stuck at a few places this time around. The UI was responsive but it still had a few minor issues regarding overflowing of the text on resizing. It took me some time but I was able to resolve these issues. Other than this, my logic for the interaction with the backend (i.e Strapi) was not working for the Forgot Password page. We (myself and Aditya) decided to remove the logic from the code for this PR and work on it separately.
Once this PR is approved, I’ll move forward with creating an option that can change the text-language for the portal. This was present as a part of the design given to me and currently I am trying to evaluate what is the best way to implement it.
Thanks for reading.
First Blog GSoC 2020 (Weekly CheckIn #1)
View Blog Post
This is Devesh Vijaywargiya, a final year undergrad at IIIT Hyderabad, India. I’m working as a student developer in GSoC 2020 in Python Software Foundation (Sub Org: EOS Design System)
The community bonding period is over now, and I’d love to talk about what I did in this period.
Majority of my time was spent on learning the React framework (or library) in depth so that I do not face any issues when I actually start with the coding. I received a design template from my mentors for the first module that I will be working on, and we had a good discussion about the nuts and bolts of implementing it. Some PRs were made as well. I set up the base directory structure for my repository and also added configuration files for JSDocs, which I will be using for documenting my code.
As planned, I have my first task in hand. I will be working on the Authentication Module which will include creating a React frontend with pages having Login, Signup and Forgot Password functionalities. This will be followed by working with my partner on this project (Aditya Sharma, who is handling the backend aspect) to insert the relevant API endpoints for all the communications with the backend.
Most of my work during the community bonding period was seamless, but to get a head start I started working on the coding aspect for the authentication module where I faced an issue with making the UI responsive. By responsive I mean that the users should be able to access the portal on any device of their choice and the UI should look perfect. To achieve this, I am using MediaQueries to change the CSS based on the size of the screen in pixels.
That’s all for now.
I’m looking forward to 3 months of coding and collaborating.