Ahmet Şentürk Weekly Efforts - bounswe/2021SpringGroup9 GitHub Wiki

1. At the very first week of the Software Engineering course, our team initially decided on a meeting day and time, to discuss the things that we have covered in the first class and the first assignment. We have agreed on some crucial details like the first version of our communication plan as well as the task allocation of the first assignment. You can see our first meeting report, written by Niyazi Ulke, here.
2. My task for this week was to create the wiki page for the documentation on our research for useful GitHub repositories. I have created the page and added the first comments.
3. Like my teammates, I researched GitHub repositories and document my favorite one for our wiki page, the Transformers GitHub repository. It is an NLP repository that is crucial for everybody dealing with ML/IE-related subjects. You can see my detailed documentation about it here
4. I have created my wiki page
5. Finally for this week, I have discovered the basics of GitHub from Wikipedia and various websites.

I kept track of the time I've spent on the tasks with a MacBook application "Be Focused". It is easy to use; you can open it from the top bar and enter a task name for each task.

You can see the details of the works for the tasks also by clicking on the task names.

^ The report of the meeting is written by Niyazi Ulke ^^ This is our team's page, I did not contribute to this page. My teammates were faster than me filing the page

1. This week we had two meetings. In the first one, we agreed on the requirements of our project, and in the second one, we discussed the details. We have distributed the tasks to the team members. You can see the meeting reports, written by Niyazi Ulke and Zehranaz Canfes respectively: 1st and 2nd.
2. My task for this week was to document the sign-in/up and recommendation sections of requirements and to open an issue about it.
3. Find a similar software product here
4. Writing down questions for customers here
5. Creating a team board on Trello

You can see the details of the works for the tasks also by clicking on the task names.

^ The reports of the meeting are written by Niyazi Ulke and Zehranaz Canfes

• Regular Weekly Meeting (Meeting 5) - 1 hour
  We decided on the 3 scenarios which were: creating posts, viewing posts, and exploring. Then we divided into 3 groups to do the mockups and each scenario is assigned to a separate group. The details of the meeting: here.

• Mock-Up Template Meeting (Meeting 6)- 1 hour
  After creating scenarios, we gathered to create templates for both android and web pages. The details of the meeting: here.

• Customer Meeting - 1 hour
  We asked our questions to the customer. The details of the meeting: here

• Creating The Searching and Filtering Scenario - 1 hour and 20 mins
  Melih Özcan, Niyazi Ülke, and I worked together as a small group to create a searching and filtering scenario for a guest persona. My job was to write down the scenario step by step which can be seen here.
• Creating The Android Mockup - 2 hours
  Again with Melih Özcan and Niyazi Ülke we developed our mockup pages after deciding on the persona and the scenario. We started with Andriod with a layout from our baseline template that we have decided before on Meeting 6. Refer here
• Creating The Web Mockup - 2 hours and 30 mins
  From android pages that we have created as a group before, I developed the web mockup pages using the same resources with the android mockup. Then I upload the web mockup pages to the wiki page, here.
• Examining Mockup Platforms - 30 mins
  Since I have used draw.io before, I've checked the platform to see whether we could use it for our mockups or not. Our team decided on using draw.io

See issue 58

• Regular Weekly Meeting (Meeting 7) - 1 hour and 10 mins
  In this meeting we talked about diagrams in general and how we can split the work. We assign a sequence diagram and 2 classes to each member and decided to merge the classes and do the use case diagram together. I was assigned to do the sequence diagram for viewing a user's profile and the class diagrams for sharing and signing up for classes. The details of the meeting: here.

• Use Case Meeting (Meeting 6)- 1 hour
  In this meeting we started to implement the use case diagram and we checked each other's sequence diagram. We also talked about some additional requirements that we came up with during the implementation of the sequence diagrams. I was assigned to update the "User" as "Registered User". We decided to learn the fundamentals of UML and ask our questions to Gokhan (TA) on Tuesday's PS The details of the meeting: here.

• Regular Weekly Meeting (Meeting 9) - 2 hours and 25 mins
  In this meeting we worked on, as a group, to finish all the diagrams. The details of the meeting: here

• Creating The Sign Up and Share Class Diagrams- 30 mins - issue #69
  I first learn the fundamentals of class diagrams from lecture slides and go through a couple of examples online. Then I implemented the diagrams. The Class Diagram of our can be seen here.
• Creating The Sequence Diagram for Viewing a User's Profile - 1 hour - issue #69
  I learned the basics of sequence diagrams and go through a couple of examples online. Later I implemented the diagram. However after the PS, we had with Gokhan (our TA), he suggested we look up the official documentation of the UML and modify the diagrams accordingly. So we modify all the diagrams on meeting 9. The complete versions of the sequence diagrams can be seen here
• Updating User to Registered User - 10 mins - issue #86
  To prevent ambiguity, we decided to use the term "registered user" instead of "user" to describe the users who have signed up. This had to be changed in requirements wiki page.
• Completing and Uploading the Use Case Diagram - 30 mins - issue #85
  After we created the use case diagram as a group in meeting 9, I made the final touches and upload the complete version of the diagram to the moodle.

• Arranged Meeting 1 (Meeting 10) - 1 hour and 45 minutes
  We talked about the milestone report and determined the topics that must be done. The project plan and RAM are decided to be created later, all other deliverables had already been done. Other parts of the milestone report (e.g., executive summary, evaluation of deliverables) were distributed among group members and my tasks were writing "RAM and project plan" part of the evaluation of the status of deliverables and its impact on the project plan and completing my part of the individual work table. Meeting note is here.

• Arranged Meeting 2 (Meeting 11) - 1 hour and 35 minutes
  Via looking at the old meeting reports, we wrote down the task names and their corresponding assignees in ProjectLibre, collaboratively. After going through all the meeting notes, we prepared the project plan. Meeting note is here.

• Arranged Meeting 3 (Meeting 12) - 30 minutes
  In this meeting we have created the RAM and the future project plan collaboratively. Meeting note is here.

• Evaluation of RAM and Project Plan - 1 hour - Issue #94
  I have evaluated the process that we have gone through preparing the RAM and the project plan in milestone report. After briefly describing our work, I also assess their impact on our project in general.

• Summary of Work Done - 25 minutes
  I wrote my individual work in the milestone report.

• Future Plan of the Project - 30 minutes
  After meeting 11, we were not sure about the future of the project so that we decided to meet the other day after making some research. I researched some bonswe GitHub repositories to get an idea about how it is done.

• Weekly Lab - 2 hours - Meeting
  At the first meeting of the semester, we first went through our repository from last semester. Specifically, we have spent time investigating the last semester's TA feedbacks, deliverables (mostly class diagram and requirements), and the wiki page. We have decided to make some changes overall before moving on to the implementation phase. We underlined the points that should be updated and/or redesigned and allocated those tasks. Our backend, frontend, and android teams are formed. Also, we decided on our application's name. Meeting report can be found here.

• Regular Meeting- 1 hour - Meeting
  In this meeting we have created a tentative project plan which can be seen from here. I was sharing my screen and we have used MS Excel for the plan. The meeting report can be found here.

• Update the Wiki Home Page- 1 hour - Wiki - Issue #224
  I updated the home page by adding a description about our project and adding necessary information underneath. The edited version of the home page can be found here.
• Update the Wiki Communication Page- 20 minutes - Wiki - Issue #225
  I updated the communication page by changing the old communication plan with the new one. The updated version of the communication plan page can be found here.
• Taking Meeting Notes & Upload to Wiki - 1 hour - Wiki/Documentation
  I was taking the notes of the first week's lab session and after that, I uploaded it as a well-written report to our wiki page. Meeting report can be found here.
• Upload Tentative Project Plan to Wiki - 10 minutes - Wiki
  I have uploaded the tentative project plan we have created to our repository. The plan can be seen from here.

• Weekly Lab - 2 hours - Meeting
  We walked through the project requirements once again before moving on with the implementation phase. We have also reviewed the updates from the last week's tasks. Also, our teacher and TA informed us about the issue template. We have discussed which issue templates should we create and decided that we should keep in touch with the TA about the subject. Meeting report can be found here.

• Regular Meeting- 30 minutes - Meeting
  IIn this meeting we have discussed the technologies and frameworks that each team (i.e., backend, frontend, and android) should use. As a member of the frontend team, I did not have any experience with frontend so we talked that I should look into the fundamentals, etc. The meeting report can be found here.

• Weekly Lab - 2 hours - Meeting
  In this lab we have reviewed the feedback notes that our TA handed us through our communicator Melih Aydoğdu. We discussed how can we change/update the issues that are noted in the feedback. These issues were:
  • Finalize Requirements
  • Finalize Project Plan
  • Finalize Class and Sequence Diagrams
  • Finalize Issue Templates

       We allocated the above tasks so that they can be poerformed in groups. Meeting report can be found here.

• Weekly Meeting - 1 hour and 30 minutes - Meeting
  In this meeting we have discussed the following:
  • The project plan that I and Melih Aydoğdu prepared.
  • The designs for the logo of our project, created by Niyazi Ülke and Zehranaz Canfer.
  • Sequence diagram changes. and we find inconsistencies in Follow a User and Report User diagrams. We discussed how to fix them. We have decided that the project plan was alright, and selected our logo. We also ran into some inconsistencies in the sequence diagrams and discussed how we can fix them. We then allocated tasks of updating the sequence diagrams. The meeting report can be found here.

• Finalize Project Plan - 2 hours - Wiki - Issue #240
  The tentative project plan we have previously created was not detailed enough to help us through our implementation process. So, we figured out it should be updated as soon as possible. Me and Melih Aydoğdu had a meeting and prepared a project plan using Project Libre. For the first milestone, we planned to run our application successfully (i.e., successfully connected backend and frontend is crucial for this milestone). By the end of the second milestone, we planned to implement the key performance metric of the application which is the Google Maps API (i.e., since our project is location-based stories, the location part requires careful attention here). In the final milestone, we planned to finalize our application by adding admin and notification systems. The project plan can be found here

• Update Report Sequence Diagram - 15 minutes - Wiki - Issue #241
  The sequence diagram was incompatible with our class diagram, so, it needed to be updated accordingly. I corrected the sequence diagram considering our requirements and the class diagram. The updated version can be found here

• Weekly Lab - 2 hours - Meeting
  In this lab session we have reviewed the updated project plan, issue templates, requirements, class, and sequence diagrams. We also discussed Activity Streams and their purpose and ask questions about them to our TA. Our TA showed an insightful resource about Activity Streams and described their fundamentals. Later we started talking about how to start the implementation phase and how to organize files/branches in the repository (i.e., we have decided that there should be a directory called postory, also, besides every feature, each team should have a master branch own their own just to merge the features before master branch). We decided that every team should discuss how to start the implementation. Meeting notes can be found here.

• Weekly Meeting - 1 hour - Meeting
  In this meeting we had further discussions about the activity streams and how to implement them in our application. We could not resolve some of our questions, so, we decided to ask them in the lab session. Also, we discussed how to store images on the backend. The backend team will further research and inform the group members. Meeting notes can be found here.

• Taking Meeting Notes & Upload to Wiki - 1 hour - Wiki/Documentation
  I was taking the notes of this week's meeting and after that, I uploaded it as a well-written report to our wiki page. The meeting report can be found here.

• Implementing Post Buttons - 3 hours - Implementation - Issue #247 - PR #252
  As we were starting the frontend side of our project, we first decided to implement the home page (i.e., as it is also planned accordingly in the project plan). Since I had no experience with REACT before, my teammates gave me a relatively easy part of the home page. I first followed this tutorial in order to gain some insights about REACT. After completing the tutorial I moved on and implemented the feature.

• Implementing Add Tag Section - 3 hours - Implementation - Issue #256 - PR #268
  Before implementing this feature, I first learned the fundamentals of array manipulation in REACT from here and here. After learning the concept I have move on with the implentation and successfully completed the task.

• Implementing Add People Section - 30 minutes - Implementation - Issue #257 - PR #271
  Since the design and the functionality of this feature was really close to tag feature (see Issue #256) I have used code snippets from that feature. So, this did not take much of my time to implement it.

• Implementing Add Location Section - 30 minutes - Implementation - Issue #258 - PR #272
  As like the people feature (see Issue #257), this one also higly resembles the tag feature (see Issue #256) in terms of desing and functionality. Hnece, I have used code snippets from that feature. So, this did not take much of my time to implement it.

• Weekly Lab - 2 hours - Meeting
  In this session we mostly discussed how to write the milestone report and how should present our product. We asked some questions to our TA to clarify some points in the milestone report description. We also asked questions about the activity stream. TA also denoted that we should send the secrets that we will use for deployment. Meeting notes can be found here.

• Weekly Meeting - 2 hours - Meeting
  In this meeting we have focussed on merging the main branches (i.e., the master branches for frontend, backend, and android). We have opened up PRs and merged them. Meeting notes can be found here.

• Popup for Unimplemented Features - 2 hour - Implementation - Issue #280 - PR #292
  After discussing with TA, we have decided that we should display some popups to users in order for them to understand that feature is not working at the moment, rather than leaving them unresponsive. I was assigned to implement this feature. As a guideline, my teammate Mustafa suggested me to follow this resource for implementing popups. After reading it through, I have grasped the idea and implemented the feature successfully.

• Deployment of the Frontend Server - 3 hours - Implementation - Issue #303
  I have created the Dockerfiler and tested the dockerized application on my local. Then I asked the backend team if they can help me with the deployment process. Melih Aydoğdu showed me his work on the backend side (i.e., workflow). We used nearly the same workflow he used for backend deployment. He also gave me some insights into GitHub actions.

• Guideline for the Milestone-1 Presentation - 1 hour - Documentation - Issue #304
  I have written down a scenario script for our Milestone 1 presentation (the frontend part). I carefully added all of the features we have implemented to the script without making them too obvious. We, as the frontend team, then rehearse the script before the actual presentation.

• Customer Presentation - 3 hours - Presentation
  For the milestone 1 presentations we presented our work to the customers. I was sharing my screen for our presentation. I also attended other groups' presentations and wrote feedback for three of them.

• Regular Meeting - 1 hour - Meeting
  We distributed the milestone group report tasks to group members. Meeting note is here.

• Frontend Meeting - 1 hour - Meeting
  We have divided the initial works for the second milestone. We have especially discussed whether we should use a framework or not. I was assigned to compare two frameworks - Materials UI and React Bootstrap. Meeting note is here.

• Milestone 1 Individual Report - 4 hours - Report
  I have written down all of the tasks (i.e., management and implementation) during the milestone 1 period, scanning all the issues, pull requests, and weekly efforts.

• Milestone 1 Group Report - 2 hours - Report
  I wrote the evaluation of the status of deliverables part of the milestone 1 group report and added evaluation for React JS. We wrote the report in markdown collaboratively.

• Weekly Lab - 2 hours - Meeting
  In this lab session we have discussed the location and time concepts again with TAs. Users should be able to enter multiple "geo-locations" and name them. In terms of time, users should also be able to specify the time of their stories flexibly. Meeting notes can be found here.

• Research: Map API - 5 hours - Research - Issue #353
  To implement one of the two crucial KPIs (i.e., location and time) there must be a map interface integrated with our application. There were two famously known APIs that suits our needs, namely Google Maps and Open Street Maps. I have conducted research to find out which one would be easier to use and for which one we could find more insightful resources. I found two resources (i.e., this, and that) about Google Maps API that can help us throughout the process. I have then shared my findings with my teammates, and we decided to use Google Maps API.

• Research: Frontend Framework - 3 hours - Research
  As the frontend team, we did not use any extra framework in the first milestone. We thought we could use one to enhance the application’s styling without excessively coding CSS scripts. I conducted research in which I compared two of the most well-known libraries: Materials-UI and React-Bootstrap. I found out that we could use some of the components of the React-Bootstrap since they meet our needs (e.g., Badge component for tags). Then I shared my findings with the frontend team.

• Weekly Lab - 2 hours - Meeting
  Backend team shared their findings of authentication (i.e., Djoser framework and JWT tokens). I shared the results of my research output of map APIs (Google Maps API vs. Open Street Maps). We have decided that the frontend should send the geolocations to the backend in lat and long format. Users will enter the time in an ordered way in descending order (i.e., first year, then a month, then day, etc.). "If a higher-ordered type of date is omitted the lower ordered ones have to be omitted as well. (I.e only year or year and month or year and month and day or all of them)". Meeting notes can be found here.

• Implement Discovery Page - 10 hours - Implementation - Issue #356 - Issue #379- PR #384
  The discovery page, as I mentioned before in the executive summary was one of our main goals for milestone 2. Since I have previously researched Google Maps API, when we were allocating the tasks within the frontend team, I took this task. Before moving on to the implementation phase, I first researched a bit more about Google Maps API libraries for React, and with the help of my teammate Mustafa Emir Çolak we found that “react-google-maps” suits best to our needs. After choosing the exact library, I have learned what is and how to use React Hooks (e.g., useEffect(). , useState()). Because of the wrapped nature of the “react-google-maps”, I needed to learn Hooks and use them, instead of the traditional class structure. I have then implemented the baseline of the discovery page with minor layout problems. I have fetched the posts that will be displayed on the discovery page from the backend using this endpoint: /api/post/all/discover Finally, using additional sources offered by “react-google-maps” (i.e., InfoBox) I have resolved the layout problems also and successfully implemented the discovery page. Acknowledgements: There was a small bug on redirecting using Links on the discovery page. My teammate Mustafa Emir Çolak helped me to resolve this issue.

• Weekly Lab - 2 hours - Meeting
  We have discussed whether all subgroups are in line with the project plan or not. The backend team will deploy the backend side as soon as possible so that other frontend and android teams could work on the endpoints easily.

• Implement User Profile Page - 5 hour - Implementation - Issue #392 - Issue #449 - PR #418 - PR #450
  In the frontend meeting at 09/12/21, we have decided on the tentative layout of the user profile page – since we did not previously created a mockup for this page. Implementing the profile page, I made use of the React-Bootstrap framework which I previously conducted research about. Arranging the layouts and gaps between components was much easier using this framework. After that, I have fetched the information of the registered users from the backend using api/post/all/user/userID endpoint.

• Implementing Like Post Mechanism - 2 hour - Implementation - Issue #426 - PR #434
  After backend team shared the endpoints with us, as the frontend team we needed to integrate these endpoints into our application. For like the endpoint was /api/post/like/postID. I successfully implemented this mechanism with the following features:

  • When a registered user clicks on the like button, she likes the post. When she clicks again, she dislikes that post.
  • If a registered user previously liked a post when she sees that post later, she can understand that she has already liked it (i.e., the default like button is filled with white – when a registered user clicks on it is filled with black. So, the application checks this state every time before displaying it to users)

• Fixing the Layouf of the Frontend - 1 hour - Fix - Issue #435 - PR #437
  After using the React-Bootstrap library for the profile page, a layout problem occurred due to ambiguity originated from same CSS names. I have fixed those problems and added some styling to the application (i.e., used Badge component from React-Bootstrap for tags, locations, and time)

• Guideline for the Milestone-2 Presentation - 1 hour - Documentation - Issue #448
  I have written down a scenario script for our Milestone 2 presentation. I carefully added all the features we have implemented to the script without making them too obvious. I have also considered the dialogs we have had with TAs in the lab sessions (e.g., attractive scenarios – up-to-date stories, etc.). We, as the frontend team, then rehearsed the script before the actual presentation.

• Customer Presentation - 3 hours - Presentation
  For the milestone 2 presentations we presented our work to the customers. I was again sharing my screen for our presentation. I also attended other groups' presentations and wrote feedback for three of them.

• Milestone 2 Individual Report - 4 hours - Report
  I have written down all of the tasks (i.e., management and implementation) during the milestone 2 period, scanning all the issues, pull requests, and weekly efforts.

• Milestone 2 Group Report - 2 hours - Report
  I explained the mapping functionality of the frontend for the milestone 2 group report. We wrote the report in markdown collaboratively.

• Weekly Lab - 2 hours - Meeting
  In this lab we got feedbacks for the Milestone 2 presentation from our TA. We have discussed our performance, and what could be done until the final presentation to meet our customer's needs. Further, we have talked about activity streams, wiki data and how can we integrate those concepts into our application. We have also talked about one specific feedback from Milestone 2 presentation, displaying resulting posts from filter operation in a timeline. Meeting notes can be seen here.

• Frontend Meeting - 1 hour - Meeting
  We gathered as the frontend team to allocate tasks for the final period. I was sharing my screen and we have designed the tentative version of the filter page that needs to be implemented in this period. We have also talked about activity streams and wiki data. We discussed how can we present those functionalities to our users smoothly. Meeting notes can be seen here.

• Research and Implement a Test - 3 hours - Implementation/Testing - Issue #391 - PR #539
  I have previously researched React tests and how to implement them. Then following this and this tutorials I have implemented a test for the profile page component.

• Weekly Lab - 2 hours - Meeting
  In this meeting, we have finalized how the activity stream and wiki data integration will be. We have decided that there should be a page dedicated to activity streams and wiki data should be used for tags (i.e., when users filter posts that have a tag, they will also be able to broaden their search with that tag's wiki data). Meeting notes that I have taken and uploaded to the wiki can be found here.

• Implement Filtering Functionality (Layout) - 10 hours - Implementation - Issue #490 - PR #509 - PR #560
  Filtering was one of our KPIs for this project. As the frontend team, we first decided on the layout of the filtering components. Then I have conducted research about React framework, Material UI. For our purposes, it was the correct library that offers great components (e.g., Tooltip). Users should be able to search/ filter using tags, date, keyword, user, and specified area - therefore I have added input spaces for all of them on top of the map on the discovery page. I have also added a blue marker representing the center of the area search, to ease the UX. Later, I have added two buttons that will query the backend with the added filters - the first one allows users to browse on the map, and the second one displays the resulting posts on a different page, just like the home page.

• Write Tests For Filtering Functionality - 2 hours - Implementation/Testing - Issue #496 - PR #509
  After implementing the layout of the filter page, I have written tests to check certain behaviors of the page right away. The properties that I have written tests to check for: render the components, click add filter buttons, and enter inputs

• Integrate Filtering Functionality with Backend - 2 hours - Implementation - Issue #532 - PR #535
  After the backend deployed the necessary endpoints for the filtering functionalities, I have integrated the endpoints with the buttons and the layout that I have previously implemented. I have also added two minor enhancements to the filter page: a clear button that clears all the current filters, and toggling popups that are displayed on clicking markers

• Implement Wiki Data Functionalities - 2 hours - Implementation - Issue #508 - PR #523
  We have decided to use wiki data for the tags in our application. When users filter the posts using a tag, they can also add wiki data (i.e., related tags) to their search. They can see these related tags by clicking on a tag that they have added. So, I have added a checkbox that users will click on when they want to expand their search, and on click pop-up that displayed the related wiki data of a tag.

• Write Tests For Filtering Functionality/ Profile Page - 2 hours - Implementation/Testing - Issue #540 - PR #545
  After I have completed all my implementation-related works, I have decided to add more tests to increase the reliability of our application. I have written tests for filtering functionality (i.e., render test that checks whether components rendered correctly and an on click that simulates user click on clear filters button) and profile page (i.e., render test that checks whether components rendered correctly and an on click test that simulates user click on follow button).

• Guideline for the Final Presentation - 1 hour - Documentation - Issue #536
  I have written down a scenario script for our final presentation. I carefully added all the features we have implemented (i.e., filtering functionality, follow request, activity streams, and wiki data) to the script without making them too obvious. I have also considered the dialogs we have had with TAs in the lab sessions (e.g., attractive scenarios – up-to-date stories, etc.). We, as the frontend team, then rehearsed the script before the actual presentation.

• Document the Code and Tests - 3 hours - Documentation - Issue #588 - PR #590
  I have left some of my implementation uncommented/documented. So, I needed to perform this task before we hand the final delivery. I commented on all the codes/tests that I have written throughout this project. I have also created a templated for test documents using lecture slides and shared it with my teammates.

• Write User Manual - 3 hours - Documentation
  I have written a well-written user manual that describes the steps clearly for users to use the Postory web application. The pages that I have documented are the following:

  • Discover Page
  • Profile Page
  • View Post Page