This is the third milestone report for our group project, group bounswe2024group5. We are a group of enthusiastic students of the CmpE352 Introduction to Software Engineering course, committed to building a semantic information browser on the domain of Music that features posting about music, discovering others' contents, and interacting with other music enthusiasts. Our team members who have contributed to the project:

• ABDULLAH UMUT HAMZAOĞULLARI
• ARINÇ DEMİR
• ASUDE EBRAR KIZILOĞLU
• GÜNEY YÜKSEL
• HALİL UTKU ÇELİK
• ÖZGÜR DENİZ DEMİR
• RAMAZAN ONUR ACAR
• SEMİH YILMAZ
• SÜLEYMAN EMİR TAŞAN

Our project is a music-specific semantic information browser. Our platform, Melodify, allows users to share their posts related to music and semantically search for others' content. We utilize the Wikidata API to support our semantic browsing.

Our objective is to utilize semantic search to provide a more enhanced search experience to the users in the domain of music. Such an approach not only improves the well-known social media experience but also provides a music-specific platform for music enthusiasts to enjoy without getting exposed to any unrelated/unwanted content.

Users can register to Melodify, set up a profile, and create posts with a text body, an optional image, and custom tags. Users can choose to post about a concert they attended, a musical instrument they are playing, or their favorite song. The users can search for content related to music, view related posts as well as some wiki information through semantic search.

To sum up, we build a music-specific semantic information browser, on both the web and mobile, for music enthusiasts to socialize and share their music taste. Currently, the registration, login, create post, search, interact with post, profile and profile settings are implemented. This signifies that the fully functional application is complete. You can read more on the status of the project in the next section.

Since the submission of the previous milestone, we made progress on our project on several different points. We mostly worked on finishing our web/mobile/back-end application. The teams that we created for these separate tasks have remained the same since we got more experienced in our tasks and became much more efficient.

Currently, the login, registration, semantic search, post creation, post interaction, profile page and profile settings functionalities of our platform are ready for use. We released the version 2 our app, the link of which can be found in the next section. The users were able to login and register in the previous release. The users can now create posts using a text body, optional custom tags and optional image uploads. The other users can see those posts by the search tool or their feed pages. The semantic search functionality allows the users to see results that are connected in meaning to their search.

In terms of organization, we fill a responsibility assignment matrix for individual contributions. Also, we utilized the Roadmap view of Github to visually keep track of our progress. Moreover, we continued to use several tools such as Discord, Whatsapp, and Github to ensure constant communication among us. We held weekly meetings, distributed the tasks among us, and took detailed meeting notes for good quality documentation. Especially,we held several meetings to discuss the implementation details in both our respective groups and between the groups. Sometimes, we did pair programming during these meetings to maximize our productivity.

You can access use cases with screenshots via this link.

• Code Repository: repo
• Release Tag: tag
• Docker Application: http://34.118.44.165/
• APK File: in the GitHub release
• Documented API: swagger
• SRS: wiki page
• Design Diagrams:
  • Use Case: wiki page
  • Class: wiki page
  • Sequence: wiki page
• Project Plan: wiki page
• Responsibility Assignment Matrix: wiki page
• Meeting Notes:
  • General: links to all meeting notes
  • Mobile: wiki page
  • Front End: wiki page
  • Back End: wiki page

URL: http://34.118.44.165/

Our application is running on port 80, it does not support HTTPS yet.

To build and deploy the application, run the following command in the main directory of the GitHub repository:

docker-compose up --build

To run the mobile app:

• follow the instructions in our repo.
• make sure to downgrade to the proper node version 20.5.1 if you encounter the DeprecationWarning.

When we tried to take an apk build for our app just before the Milestone 2 demo session, we faced an error which we had never faced before. At that time, we were using expo go and development builds for seeing the changes simultaneously. Since we faced this error just before Milestone 2 demo session, we were not able to solve this in Milestone 2. Therefore, we consider this a challenge for Milestone 3 because it also was a challenge to solve. For solving this, I go over several searches such as stackoverflow, github issues and expo documentation. From my search I was able to guess it was about our endpoints being "http" instead of "https" but I couldn't come up with a proper solution. I added some parameters and plugins, changed config files but none of them worked for our app. Finally, I asked our problem in our group chat which includes almost all students who take cmpe 352 this semester. After a little debate and examples from my peers, I was able to find the solution. Solution was very simple, just adding a plugin for letting our app to use "http" protocol, but in the correct place. Addition of usesCleartextTraffic as an expo-build-properties in a app.json plugin solved our problems. Solution was this simple but It took some time since we needed to take builds for every try of a new solution. After some time, we were at the limits of expo free tier and we needed to wait for some time.

Throughout the implementation of mobile app, we, the mobile team, utilized Expo Go to deploy our app. However, we encountered a build issue at some point, due to the most recent updates of Expo Go. Not knowing the issue was because of this outside reason, we spent some time troubleshooting. After examining the official documentation of Expo Go and searching the error online, we figured that the problem was due to the old version of Expo Go we were still using. Updating the SDK resolved this issue. Moreover, during the period of a month, when we were implementing the mobile app, we faced with several node version incompabilities. Some modules we were using in our code got deprecated during this period of time, resulting in unmwanted compability errors on our side. As the mobile team, we often consulted internet to learn about the recent node updates, and how to bypass deprecated warnings via getting rid of the old modules or downgrading node versions.

After the task distributions were made, I ran Docker to perform my tasks, but I received the "mysql.plugin doesn't exist" error. To solve this, I first reset all containers, volumes and images in docker. When the problem persisted, I deleted mysql from my computer and tried again, but the problem still persisted. Then I tried it on Ubuntu 22.04.4 (using VM) but the same error persisted. Then, I installed the second operating system on my computer as Windows 10. However, this did not solve my problem. Then I upgraded the operating system to 11 and tried again but the result was the same. Throughout this process, I tried all the solutions on the internet, but none of the solutions worked. Then I contacted my friends, connected to the remote database and started my work from there. Unfortunately, this was a very challenging process and on the 5th day, remote db came to my mind with the suggestion of my teammates. During this period, I could not contribute to my team and fell behind the team, but I tried to make the most of the remaining time. Later I found out that the problem was that a new version of mysql was released and that was why I was getting this error. Unfortunately, it was a very painful experience. You can access all error pictures.

Throughout the process of implementing our new version of the project, we learned:

• How to make requests to backend endpoints from Mobile, and to always provide the necessary authentication token.
• How to pass a parameter between mobile pages, and utilize this (kind of global variable) across pages of the platform.
• How to parse the responses we get from backend to use the results in mobile.
• To utilize postman to ensure the connections between backend and frontend, and to test our code.
• How to document APIs with swagger.
• How to structure SPARQL queries for wikidata.
• How to utilize elastic search for in application searches.
• How to build API endpoints.
• How we need to strictly stick to our design plans and diagrams, since most of them connect different areas of interest into a single page and ease communication between teams.
• How to establish a connection between a server and the Google Cloud system.

Initially, I focused on solving the network error that caused us to not sending a request to our backend. I focused on solving this because if we cannot serve a deployed build that our customers can use, that would be a total disaster. I mentioned about this in the subsection 1.5 above. Also, another minor challenge was getting responses from our backend, some of them were returning text instead of json, some of them with different status, opposite to the api design we checked via swagger, so, until we understand the issue, we lost some time. For example, we expected a json after a successful update of an image but got a text (the url of image) and spend time on this.

Milestone as a whole, I focused to create a standard for our mobile app by going over but not limited to the missing requirements and hence providing a better user experience. For that, we first meet with our mobile team and go over what should be done. Then, I self assigned myself to some sub-issues that need to be covered. They were, adding a search result page that could cover both semantic search and post related search, adding a profile settings screen, adding a new screen for showing post and their interactions separated from other post, and finally some fine-tuning in the app such as but not limited to adding a logout button to profile. Also, I was also in communication with Ebrar, we helped each other to go over the issues we faced in react-native and design. Below is my important PR's and issues. You can find detailed information about them in my wiki profile.

• Pull Requests
  • #191: Fixing network error (http request).
  • #204: Profile settings and minor updates on profile.
  • #206 & #223: Search Result Page and its fixes.
  • #213 & #231 : Post Interactions Screen (Showing 1 post).
• Issues
  • #192: Fix network error.
  • #202: Implement profile settings.
  • #208: Implement search page.
  • #214: Implement post interactions page.

Since the second milestone, I have contributed to several key tasks. I built a service to parse wiki data entities and created a database table for this data. I wrote SPARQL queries to fetch related entities from wiki data. To improve search functionality, I integrated Elasticsearch into the project. I also developed a service to search for wiki data using the wiki data API #205.

I implemented the feed endpoint which returns posts ordered by creation time and learned pagination in the database repository with Spring Boot #198. I worked on deploying our application to Google Cloud and fixed several backend bugs, including a CORS issue.

My most import contributions are in those pull requests: #219, #199, #151

I faced challenges connecting to the Elasticsearch repository from the backend due to misconfigurations, which I resolved by writing custom configurations. Importing ~700k wiki data entities initially took 4 hours; using JpaRepository.saveAll surprisingly decreased to 5 minutes. We encountered issues with MySQL when the latest version changed, which could not recognize an environment variable. We temporarily used the remote database in development and eventually switched to MySQL 8.3.0.

Throughout this milestone, I learned to implement keyword-based search and data indexing using Elasticsearch, work with SPARQL queries, manage wiki data integrations, and handle pagination in Spring Boot. These contributions significantly enhanced our project's functionality and performance.

My main contribution for this milestone is to write the bulk of this milestone report file. issue Other than that, I tried the apk file on my virtual android device and confirmed that it works. issue

My main contribution to this milestone has been the implementation of the components that we use to display posts, create posts, make search, and view search results. For the post component(#172) I designed and implemented a reusable component content of which is populate with the data we get from our feed enpoint. For creating a post I implemented a dialog component (#234). For search I implemented a search bar. And to view results, I made a component for viewing wikidata items. And also I implemented tabs so we can switch between feed and search results. (#235). Other than that I connected those components to our backend endpoints and spent quite a bit of time troubleshooting api endpoint errors.

Please see this pull request to inspect my most important contributions.

The most challenging part of this milestone for me was errors that I encountered during implementation phase. For example I kept getting CORS error and then I realized it was about the server configuration so I reported the issue to backend team and they solved it. Also there was an error where database container was abrubtly exiting. For this I had to connect to our remote database because I couldn't get local database to work. But same error occured in our server as well. Upon detailed inspection we realized the latest version of mysql had introduced breaking changes. So we solved the problem by downgrading.

I have initially organized the things that we have planned to do in the front-end team in the form of issues. The main issue is this.

For this last milestone, I focused on our mobile application, with my teammate Ramazan. I initially implemented a Post component, a comment screen and extended the Feed page to display all the available posts on the platform, as well as the tagging and uploading image functionalities to create post screen PR #203. I then worked on the implementation of the requests to backend endpoints. With valuable support from Ramazan and the entire backend team, I implemented several connections between the mobile UI and our backend, ensuring a smooth functionality and user experience for our platform.

As the communicator of my team, I ensured constant communication between the team and the teaching staff. Taking a step further, I closely followed the discord server for any announcements from the teaching staff and quickly informed my teammates about the matters. I mostly moderated, and took notes for the mobile meetings we held. Also, as a documentation geek, I paid significant attention to the wiki component of our group repository. I reviewed most of the wiki pages we had, fixed minor typos, added missing enumerations etc. You can see my contribution in most of the wiki pages we have. Moreover, I put important effort into creating our project plan. I often reminded to add our issues and PRs to our Project as well as the Milestone 3. I added start and end date to the issues, for them to be displayed properly in our project plan.

You can view my personal wiki page to see my weekly contributions.

• Pull Requests
  • #203: Mobile UI screens
  • #215 & #229: Mobile requests to backend for personal profile, comment and share post screens.
  • #224: Preserve the user info as a parameter between Mobile screens.
• Issues
  • #190: Improve create post screen.
  • #200: Implement post component and extend feed page.
  • #238: Implement various requests to backend.
• Challenges and Solutions

  Challenge	Solution
  Expo Go and node version incompatibilities	I referred to official documentations and consulted ChatGPT to figure out which SDK version to update to.
  Infamous network issue on Mobile	I brainstormed with Ramazan and asked to teammates, friends for possible solutions. [Ramazan was able to resolve this issue thanks to a suggestion from a classmate, as elaborated in detail in section 1.5.]
  Parsing the response coming from the backend.	The types of the responses we obtained from backend varied from json to string format occasionally. I utilized postman to check for such response formatting and applied them accordingly to the mobile implementation.

• Pull Requests
  • #212 file upload using google cloud services
  • #222 follow/unfollow
• Issues
  • #240
  • #209
  • #168 with Semih
• Implemented API Functions

  HTTP Method	API Endpoint	Description
  POST	api/file/upload	upload a file to application
  POST	api/users/follow/{username}	follow a username
  DELETE	api/users/follow/{username}	unfollow a username

During the challenge I mentioned above, I gave feedback to the PRs opened by my teammates and tried to support them by giving feedback or insight about the API. I tried to make the best use of the limited time I had left immediately after the temporary solution. Unfortunately, I couldn't do 3 PRs during this time. I explained to you the most difficult part for me in this milestone in the "Docker MySQL Error for Backend (Süleyman)" section in 1.5. This challenge affected the entire process of this milestone, but it was a very valuable experience for me. It enabled me to implement endpoint in a short time and carefully.

• Pull Requests

  • #196 implemented post endpoints. (create, update, delete, get by params etc.)
  • #226 implemented user profile endpoints. (get, update, get followers etc.)
  • #230 implemented post like and unlike endpoints.

• Issues

  • #168 revised swagger API documentation.
  • #193 implemented post related classes.
  • #195 implemented tag class.

• Wiki Documentation: Personal Wiki Page

• Implemented API Functions

  HTTP Method	API Endpoint	Description
  POST	api/posts	Create a new post
  GET	api/posts?author={author_username}&tag={your_tag}	Get posts optionally by author and tag
  GET	api/posts/{postId}	Get a specific post by ID
  PUT	api/posts/{postId}	Update a specific post by ID
  DELETE	api/posts/{postId}	Delete a specific post by ID
  POST	api/posts/{postId}/like	Like a specific post by ID
  DELETE	api/posts/{postId}/like	Unlike a specific post by ID
  GET	api/users/{username}	Get user profile
  PUT	api/users/{username}	Edit user profile
  GET	api/users/{username}/followers	Get user follows
  GET	api/users/{username}/following	Get users followed by a user

  • Sample API Call Transcripts
    1. Update Post
       • Request

       PUT /api/posts/12345 HTTP/1.1
       Content-Type: application/json
       
       {
           "text": "edited content"
       }

       • Response

       HTTP/1.1 200 OK
       Content-Type: application/json
       
       {
           "id": "12345",
           "author": "john_doe",
           "text": "edited content",
           "media_url": null,
           "created_at": "2024-05-11 22:43:27.0",
           "edited_at": "2024-05-11 23:44:45.0",
           "tags": ["a tag","rock"],
           "likes": 10
       }

    2. Get Users Followed by a user
       • Request

       GET /api/users/john_doe/following HTTP/1.1

       • Response

       HTTP/1.1 200 OK
       Content-Type: application/json
       
       [
           { "username": "jane_smith"    },
           { "username": "michael_gates" },
           { "username": "mike_jones"    }
       ]

• Unit Tests

  • A sample unit test:

  @Test
  void convertToResponseWithPostHavingNoTags() {
      // Given
      User user = new User();
      Post post = new Post("text", user, "media_url");
      post.setId(1L);
      when(tagService.getTagsByPost(any(Post.class))).thenReturn(Collections.emptyList());
      when(postLikeService.numberOfLikes(any(Long.class))).thenReturn(5);
      // When
      PostResponse postResponse = postService.convertToResponse(post);
      // Then
      assertEquals(1L, postResponse.getId());
      assertTrue(postResponse.getTags().isEmpty());
      assertEquals(5, postResponse.getLikes());
  }

• Other Significant Work

  • I reviewed pull requests and gave feedback.
  • I gave technical assistence to front end and mobile teams especially for the usage of docker and API endpoints.

• Challenges and Solutions

  Challenge	Solution
  Circular Dependency Among Classes	Directly referencing repository class instead of service class from one of the circularly dependent class
  Not Having up to date app behaviour	calling docker-compose with --build flag

• In this milestone my work was solely focused on implementing the search part of the frontend. I created the initial page for the search functionality. I created the first version of the search preview component.

• My main challange in this milestone and in the previous one is that until one month ago I've never coded anything in React and I'm still learning it.

• Most important issue and pull request related to my work is #173 and #227

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, , declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Abdullah Umut Hamzaoğulları, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Asude Ebrar Kızıloğlu, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Regarding the submission of all project deliverables for the CMPE 352 course project during the Spring 2024 semester, I, Süleyman Emir Taşan, declare that:

• I am enrolled in the Computer Engineering program at Boğaziçi University and taking the CMPE 352 course in the Spring 2024 semester.

• All the materials I am submitting for my project (including but not limited to the project repository, the final project report, and supplementary documents) have been prepared solely by me.

• I have prepared this material individually without assistance from anyone else, except for the permitted peer assistance that I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Semih Yılmaz, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Güney, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Ramazan Onur Acar, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Deniz, declare that:

• I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

• All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

• I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Ebrar, Arınç, Süleyman