This is the second milestone report for the bounswe2024group11 team. It includes a summary of what we have done so far, the implementation of the current deployed application, the design diagrams, updated project plan in a detailed manner, lessons we have learnt, difficulties we have faced, work done by each team member, and the tools we have benefitted.

At the end of the report, we have dedicated a section for our self evaluation.

This project aims to build a comics-specific semantic information browser (SIB). Users will be able to create posts and search for them. The system will use Wikidata API to support the semantic searching of posts.

Users will be able to register and login to the system so that they can make a short post, bookmark or like posts. They will also be able to see those who posted or liked content and follow them.

The system will use Wikidata API to make semantic queries to the Wikidata Database. Utilizing "subject-predicate-object" nature of these SPARQL queries, the system can search for objects that has semantic relations.

Our solution will provide an API that will be used by Web and Mobile clients. Hence, the system will provide a web and a mobile application.

Our project has announced a pre-release. In this prerelease, we have provided both mobile and web applications. In these applications, the users can create an account, login to their accounts, and make a limited semantic searching. Along with these applications, the users can use Swagger UI to learn how to use the API endpoints that we developed.

• Release Tag: Please follow the link to Group11-Practice-App-Release-v0.1.
• Web Application: Please follow the link to Zenith Web Application.
• Build & Run: You can refer to the detailed guide in README file in the project repository for deploying and testing the application on your local environment or another host machine.

• Project Github Repository
• Backend Code of the Project
• Frontend/Web Code of the Project
• Mobile Code of the Project
• Swagger for API Documentation

• The backend team successfully developed three key endpoints for user signup, login, and search.
• The signup and login endpoints utilize token-based authentication, ensuring secure user sessions through cookie storage.
• The initial search functionality is integrated with Wikidata to provide a basic search mechanism.

• All implemented endpoints are covered with unit tests, enhancing code reliability.
• The backend is well-documented using Swagger UI, facilitating clear communication and future development.

• The application is fully Dockerized, enabling streamlined deployment.
• A docker-compose file efficiently manages the backend, frontend, and database containers.
• A continuous integration/continuous deployment (CI/CD) pipeline is in place, automating deployments from the main branch, thereby improving efficiency.

• The team adopted a sophisticated branching strategy. Every team has its own develop branch and a common develop branch besides the main branch. Whenever we add a new feature, we created a new branch for that feature and created a pull request to merge the changes for the develop branch of its team. In some intervals, when we implemented the critical details indiviually, we merged them in the common develop branch in order to let other teams to use our newly added features.
• The team followed conventional formats for commit and pull request messages, enhancing code organization and simplifying code reviews.

Designs

• ✅ Class Diagram
• ✅ Use Case Diagram
• ✅ Sequence Diagram

Project Plan

• ✅ Project Plan
• ✅ Responsibility Assignment Matrix (RAM)

• Frontend Meeting #1 : Division of mobile and web team
• Backend Meeting #1 : Discussion about backend development strategies and first look at Django REST framework
• Backend Meeting #2 : Started to work on endpoints and developed an understanding for Django REST
• Frontend Meeting #2 : Implementation of mobile and first bug issue for web
• Backend Meeting #3 : Dockerization of backend, creation of tests for API
• Weekly Sync #13 : Sync between frontend and backend
• Backend Meeting #4 : First look at Swagger API
• Weekly Sync #14 : Creation of README files, branching for each team in the repository
• Mobile Meeting #1 : Implementation of mobile and connection to backend
• Backend Meeting #5 : Implementation of WikiData API

• WhatsApp

  The immidiate communication among team members has been done through WhatsApp since it is very mobile and reaching a person is easy and fast.

• Discord

  Meetings other than weekly syncs such as subteam meetings and task meetings have been done through Discord. It is easy to use compared to Google Meet for quick meetings.

• Google Meet

  Weekly sync meetings have been done through Google Meet. It provides a more formal and clean meeting environment for planned meetings.

• Git and GitHub

  Github is our main platform to develop and document our project. We collaboratively develop backend, web, and mobile codes in a single repository. Collaborative code development, version management, and branching provided us as a group of 10 people to work on a single project effectively. Issue management on Github also provided us to keep track of the work that is done and being done. On Wiki, we share our meeting notes and our researches so that we can refer to them later. We used discussions page to announce important developments and to formally discuss important topics about the project. All in all, Git and Github are the most important tools that help us develop our project.

• Google Sheets

  While doing the meetings, quick notes have been noted using google sheets. It provides an interactive noting experience among many users so we have used it for our collabarative notes such as structure of project plan, meeting notes, and questions to be asked to the teacher.

• Figma

  Figma was the source of truth as to what is to be displayed on mobile and web screens so that team members did not have to explicitly talk about the UI designs. The design were satisfactory most of the time. At time they were not, people came in together and made minor adjustments, such as adding missing buttons, links etc.

• Expo

  For mobile development, we used Expo tools for bootstrapping the project, test in a development server, try it in an emulator, and finally build and produce an .apk file. Expo CLI tools and EAS building server helped us to get the built application.

• Team Management On Backend

  As for the backend side, our teammate Muhammed Emin Arayıcı directed us towards the goal of completing the project, pushing us towards it. Therefore, it can be said that he became a natural leader. He played a very active role in initiating the project repository, deployment, and server-side tasks. He was the one that mostly communicated with the frontend teams and solved their corse error (web) and usecleartextTraffic (mobile) error. So, it can be said that the project management of the backend mostly happened under the leadership of Muhammed Emin Arayıcı. This model of team management encourages team members to get the job done and finish the project.

• Team Management on Frontend

  Frontend team consisted of only 2 members, Ümit Can and Hasan Kerem. Ümit Can mostly gave with the initial proposal of decisions and they settled on them after discussions. They went hand to hand at all stages of the development process. Not a single line of code has been written by someone without the review of the other. Even though different tasks have been assigned to different person for the sake of feature ownership, everything was built together. At any time on any task, Hasan Kerem was able to ask Ümit questions and move forward. They have done many quick calls and meetings to sync up. At times, Ümit Can worked alone on a single issue and discussed what he has done with Hasan Kerem after resolving it.

• Team Management on Mobile

  Mobile team consisted of 3 members, Emre, Arda and Muhammet Emin Çiftçi. Neither of the members had an experience with any mobile application development tool; therefore, they needed to develop the app while also learning the functionalities of React Native. For almost every task, all the members had a look on it so that there would not be a mistake that could cause more trouble in the future. For every step of mobile development, every member moved together and this made the process much more fluent and less time consuming. Additionally, Ümit Can was also able to help the mobile team since he had a considerable amount of experience in React which has very strong connections with React Native.

• A challenge for backend and web teams was to understand the CORS structure, since the error was not an error type that was faced before for both teams. Another issue was the fact that overcoming this issue in local development environments was not enough to solve this problem on the deployed machine.
• A challenge for mobile was the difference between development server and built application when connecting the backend. While development, we could easily fetch data from the backend API without setting additional option for android. Expo tool helped us here. But when the application is built and when we get the .apk file, it suddenly stopped connecting to backend. Since the .apk file does not have any debugging features, it was bitter work to understand the problem. But at the and we finally managed to find out the issue and rebuilt the application with different Android build options.
• A challenge for the web team was trying to send the right request data to the back end. We were sending the data using JSON.stringify method. However, this was not the right format. We needed to send the formData directly instead of using JSON.stringify method. Figuring this out took our time.

• Moving forward, the backend team will focus on enhancing the search functionality.
• The team will explore potential improvements to the CI/CD pipeline for faster and more reliable deployments.
• A web server such as Nginx and a web server gateway interface such as Gunicorn will be added to upfront of the application.
• Mobile team will improve the navigation of the screens since we need to add new screens such as posts and profiles.
• Interacting with backend with simple javascript fetch API is sometimes hard to maintain. We will find new tools to connect to the API in both of the web and mobile clients.
• The web team will create a feed and profile page. After that we will make an UI to create new, edit and delete posts.
• As backend team implement new features the web team will connect them to our webpage so that our app will have all the functionalities planned.

You can view each student's personal efforts page here

Muhammed Emin Arayıcı
Researched how to initialize a Django app, a React app, and a React Native app. Initialized the backend, web, and mobile apps during a weekly meeting. issue1 issue2
Adjusted appropriate .gitignore files for each app.
Learn advanced Git techniques to enhance version control practices, such as creaitng a branch.
Researched how to implement API endpoints and implemented API endpoints for the User model with Ceydanur Şen. All CRUD endpoints were ready. issue
Researched how to write API unit tests and wrote API unit tests for the User model with Mücahit Erdoğan Ünlü, ensuring robust functionality. issue
Researched cloud platforms to identify optimal deployment solutions.
Explored methods for securely sharing secrets within the development team. issue
Investigated various API authentication types to find a better suit for our application. Founding a token-based approach is more suitable for us.
Researched how to dockerize whole application including database. Dockerized database, backend, and frontend applications together with a docker-compose file and multiple Dockerfiles. issue1 issue2 issue3
Executed manual deployment of the application, optimizing deployment procedures.issue1 issue2
Researched and implemented a CI/CD pipeline to streamline development and deployment processes. issue
As a service maintainer, performed multiple manual deployments to the test and prod environments, refining deployment accuracy. Also, maintained the databases.
Configured Bruno for standardizing the project-specific API calls. issue

Challenges Faced:

Initializing the Project

Challenge:
Getting started with project setup can be overwhelming, especially when laying out the foundation for a web/mobile application.

Solution:
Creating a comprehensive project roadmap helps outline all necessary tasks, setting the stage for efficient development. Reading tutorials & documentations was helpful. Also, there are some guys out there sharing their approaches as a video content.

Writing First Endpoints

Challenge:
Defining the first set of endpoints can be challenging as it is my first time using Django. Also, there are multiple approaches for defining endpoints in Django. This affects the learning and choosing process.

Solution:
Reading multiple tutorials and comparing them is helpful but time consuming. Choosing a clean version and iterate over others after implementing the cleanest version was my choice.

Learning to Write Unit Tests

Challenge:
Writing effective unit tests requires familiarity with testing frameworks and best practices. There are tons of different libraries for writing unit tests in Python and/or Django.

Solution:
After finding tutorials on it, implementing it with a team member is helpful. Actually, I believe in implementing a newly learned thing with a buddy is very helpful in general since you need to explain every step to each other.

Designing the Infrastructure

Challenge:
Structuring the application’s infrastructure is crucial for reliability, scalability, and performance.

Solution:
Reading tutorials, watching videos, and sleepless nights were the solution this time :)

Dockerizing the Application

Challenge:
Dockerizing involves containerizing application components, which can be complex. choosing right images and configuring the dockerfiles are cahllenging. Also, we need to cotainerize the whole application including web, db and backend, which adds up to the challenge. Using ChatGPT is helpful in this context.

Solution:
Adopting clear guidelines and best practices for Dockerization helps create manageable and portable containers. Using Docker Compose aids in orchestrating multi-container applications.

Connecting All the Containers Together

Challenge:
Interconnecting Docker containers requires careful configuration.

Solution:
We used the static IP address of the container itself to connect the web adn the abckend containers, whihc is not a good practice. We need to change this in the next milestone. Using a web server or using Docker Swarm might be helpful.

Not Having a Web Server

Challenge:
Lack of a proper web server can hinder application deployment forwarding.

Solution:
Implementing a suitable web server like Nginx or Apache with a compatible WSGI/ASGI improves application delivery. Configuring it appropriately enhances performance, security, and scalability. It not only helps to balance the load, but also provides port forwarding, etc.

Deployment

Challenge:
Deploying applications involves moving code to a live environment, often presenting unforeseen issues. Creating an appropriate VM and figuring out how to securely connect is a challenge.

Solution:
Establishing a standardized deployment process, including a testing phase, minimizes deployment risks. Connecting to the server and building & running the application sounds like it includes very hard steps. After learning it, this is not a big issue.

Establishing a CI/CD Pipeline

Challenge:
Creating a CI/CD pipeline requires configuring continuous integration and deployment tools with proper configurations.

Solution:
Using GitHub Actions helps automate building and deployment to the production server. Actually, this is one of the hardest challenges I've ever encountered. The best solution is to implement everything step-by-step from a very clean and simple video tutorial. Iteratively refining the pipeline afterwards ensures it meets project needs. Adding automated tests to the pipeline is a task for the next milestone.

Following Security Best Practices

Challenge:
Security is paramount, but implementing best practices can be complex.

Solution:
Before sharing or connecting to anything, I researched what can I do here to minimize the security risks. However, there are some more practices we do that doesn't comply with the security best practices. They need to be fixed in the next milestone.

Learning to Use Git in Steroids

Challenge:
Mastering advanced Git workflows can be daunting.

Solution:
Providing training on advanced Git features and implementing clear Git usage guidelines enhances team collaboration.

Crafting a Suitable & Reliable Branch Scheme

Challenge:
Establishing an effective branching strategy is crucial for team collaboration and application reliability.

Solution:
Adopting a Git branching model like Git Flow helps manage code versions effectively. We don't use the full stages of the git Flow yet. Regularly reviewing and adjusting the strategy ensures it aligns with project needs. We have a sophisticated branch scheme, now.

Standardizing Calling the APIs

Challenge:
Testing and using APIs among team members require a deep collaboration.

Solution:
Creating a shared API documentation and setting clear testing standards promotes consistency. Using shared testing tools and environments further aligns team efforts. We used Bruno for this purpose. Afterwards, we have a Swagger UI as well.

Fixing Urgent Problems Such as Broken Test Database

Challenge:
Addressing urgent issues, like a broken test database, can derail development since noon can test/use the required resources. Such cases require rapid responses.

Solution:
Finding and addressing such issues as early as possible is very important. After that, fixing this is a very urgent task since it stocks all the development processes.

CORS Errors

Challenge:
Cross-Origin Resource Sharing (CORS) errors can block API requests.

Solution:
Configuring proper CORS policies on the server resolves these issues. Carefully defining allowed origins and methods enhances security while addressing CORS needs.

Blocked HTTP Requests on Mobile

Challenge:
Since we don't have a TLS/SSL certificate on the server yet, we need to use HTTP calls. HTTP requests being blocked on mobile devices as a security practice. And since this problem only occurs in the real device tests (i.e., not in the device emulator tests) this issue is addressed and solved in the last minutes.

Solution:
Configuring the mobile application settings to make HTTP calls is the quick solution. For the long term, we need to have an SSL certificate on the server.

Building Mobile App

Challenge:
Building the .apk version from the mobile app is very different from building and running it on the device emulators. This process challenged us. Also, this issue is addressed on the last minutes.

Solution:
Using different accounts for the building process of Expo can fasten the process a bit. However, the build process is very slow. This needs to be solved properly.

Managing the Team and Distributing and Tracking the Tasks

Challenge:
Effective team management is crucial for project success. If a stakeholder doesn't do his job or some tasks are coming late, all the iterative tasks are shifting.

Solution:
We distributed our tasks with our critical path in mind. And when we realize some tasks are not delivered on time, we generally redistribute those tasks. We make checks very frequent, especially on the last few days.

Forgetting to Write Issues

Challenge:
Doing a task and then forgetting to write issues for them is a problem. It doesn't reflect your real effort to the others. Hopefully, GitHub records , almost, all the activities you do :)

Solution:
Not doing tasks without first writing its issue might be helpful. However, especially on the last days, this is very hard to do since there are many urgent tasks to do.

Yunus Kağan Aydın
Learned the fundamentals of class diagrams. issue
Documented the Weekly Sync #9. issue, meeting
Updated requirements page on wiki due to Emre Kılıç and Mücahit Erdoğan Ünlü's meeting with TA. issue
Documented the Weekly Sync #10. issue, meeting
Initialized sequence diagram for following a user with Arda Vural and Muhammet Emin Çiftçi. issue
Documented the Weekly Sync #12. issue, meeting
Documented the Backend Meeting #1. issue, meeting
Documented the Backend Meeting #2. issue, meeting
Did a research on how to connect Django to MySQL and documented it on a wiki page. issue, documentation
Documented the Backend Meeting #3. issue, meeting
Documented the Weekly Sync #13. issue, meeting
Did a research on how to store image fields and documented it on a wiki page. issue, documentation
Documented the Backend Meeting #4. issue, meeting
Did a research on OpenAPI specifications as in Swagger UI and documented it on a wiki page. issue, documentation
Documented the Weekly Sync #14. issue, meeting
Documented the Backend Meeting #5. issue, meeting
Connected Backend to Hosted Database based on my previous research. Muhammed Emin Arayıcı helped me when I was stuck on implementation.
Reviewed Well Designed Documented API wiki page documentation. Removed unnecessary parts.
Modified response codes with Mücahit Erdoğan Ünlü. Regenerated 404 error code with 401 on login errors and regenerated 200 with 201 on register. issue, pull request
Modified unit tests according to modification on response codes with Mücahit Erdoğan Ünlü.
Updated sidebar with proper research pages, ordered them alphabetically. issue
Documented the Weekly Sync #15. issue, meeting

Challenges Faced: I didn't have any experience on the backend part. Learning all of these concepts in a short amount of time was quite stressful. I think it would have been better if we had a little more time. I guess our lack of knowledge in the backend part slowed us down. But I take this as a valuable experience to myself. I am hopeful that we will practice better in our final milestone. Solutions of These Challenges: I tried to spare long hours in order to learn and understand the concepts before documenting them on wiki page. We increased our communication density in order to keep up with frontend and mobile teams.

Muhammet Emin Çiftçi
Revised the project plan with Muhammed Emin Arayıcı and Ceydanur Şen. We updated the plan after the meeting with Kutay in which Kutay gave us feedback about it. issue .
Learnt the fundamentals of class diagrams. issue
Participated in the creation of the class diagrams. However I could not make much contribution due to health issues. meeting
Participated in weekly sync #10 in which we distributed the sequence diagrams. Arda Vural, Yunus Kağan Aydın, and me initialized the sequence diagram for following a user. issue
Documented the weekly sync #11. issue.
Bootstrapped the very first version of the mobile application with Emre Kılıç and Arda Vural. issue
Learnt the fundamentals of React Native and how to develop a React Native application. issue
Created the second milestone. It consists of two main branches: Design and implementation.
Documented the frontend meeting #1. issue. The division of the teams occured in this meeting as two members were chosen for web team and the remaining were chosen for mobile.
Documented the frontend meeting #2. issue. The sync between web and mobile was entablished for the first time.
Reviewed the login page implementation for mobile done by Arda Vural. issue. Also reviewed the home page implementation for mobile done by Emre Kılıç. issue
Implemented the signup page for mobile consisting of full name, email, user name, and password fields. issue
Documented the mobile meeting #1. After the implementation of basic components, we divided the next tasks among the members.
Connected the signup page the other compononents with Arda Vural and Emre Kılıç. First, we chose to connect it to the home page, but decided on connecting to login page and make the user login after registration. issue
Updated the project plan with Hasan Kerem Şeker and Ozan Oytun Karakaya. Also updated the Project Libre file in our repository. All the changes were done according to the elaboration of the tasks while doing the implementation and design phase of the project. issue
Added local storage functions and fetch methods according to the endpoints' methods (GET or POST). It was done with Emre Kılıç and Arda Vural. issue
Added functionalities to the buttons on signup page for mobile. Connection with the endpoints was established and new users could register the system without a problem. Error handling was also done. issue

Challenges Faced and Their Sollutions:

• For the design phase, the class diagram was not so clear for us. We tried to come up with one; however, it felt wrong and we didn't know how to make it complete. While doing the implementation part, my team mates from backend was able to come up with a more suitable one since we had already implemented the classes we needed to include in the class diagram. Not having a experience in drawing diagram made us stuck in this process.
• For the implementation phase of mobile, we were not sure how much resources we needed to reserve for since there were no one who worked on it before. Due to this lack of experience in mobile branch, we were not that sure if we were doing fine or not. For me, I was so stuck in making my work as good as possible, I could not achive that much. Briefly, I was very slow and I think to overcome that, I need to do some practices and give my time before implementing anything for the mobile.
• While we were doing our implementation in our local repository, we needed to share our progress with each other for both testing it and doing our work with respect to it. First, we tried to use one branch but after facing some Git conflict management issues, we decided on having multiple branches. In conclusion, we were able to save our progress by commiting our progress to a specific branch and were able to check the others progress and test them.
• In order to demonstrate and check if a function or component was working, we needed to use an android operating system. There were several options and my team mates used the Android Studio option. However, I was not able to run Android Studio and when I was able to run it, it was so slow and my computer could not handle. My solution was using the QR code genereated by expo. I downloaded a mobile app to my phone called Expo Go. By using it, I was able to see my and others progress on an android operating sytem.

Ümit Can Evleksiz
(DES) Created UI designs for web and mobile in Figma. Collaborated with Hasan Kerem and Arayici for web designs and with Emre for mobile designs.
(DES) Helped M. Arayici refine Use Case Diagrams. Spotted a few points to improve
(DES) Reviewed Sequence Diagrams. Did not contribute as much as I should've :(
(DES) Went over Class Diagrams with Emre and Hasan Kerem, suggested a few changes.
(DOCS) Wrote a readme file for backend & containerization with the help of Arayici
(DOCS) Helped Mucahit write readme file for frontend application
Created a WebP Document
(VC) Made semantic decisions on the version control such as PRs and branches. Discussed how to resolve a conflict, how to review and contribute to PRs etc.
(FE) Led the frontend project, discussed several design decisions with Hasan Kerem. Decisions settled on include: Language (TS), Tooling (Vite), UI Library (Mantine), Styling Approach (Utility classes with TailwindCSS) My all FE Issues
(FE) Bootstrapped the frontend application.
(FE) Configured PostCSS, Tailwind and MantineUI for them to work together. An Issue
(FE) Wrote custom button, inlineLink, checkbox components for the FE.
(FE) Helped Hasan Kerem write an imageLink component.
(FE) Added typesafe-react-router and configured it in the FE. Issue
(FE) Implemented Login and Register routes with Hasan Kerem
(FE) Wrote actions and loaders from the routes Home, Login, and Register. Loaders are the functions to be invoked whenever a route is transitioned to and the actions are the functions to be invoked whenever a non-GET (POST, PUT, PATCH, etc) request is made into some endpoint. Loaders help fetching data on each route render, and actions help respond to user form submission (search, enter login credentials etc.)
(FE) Discussed and determined the routes and query parameters to be used in the FE. Issue Link
(FE) Defined schemas for User, Login, Register, and Error
(FE) Wrote an InfoBox component the display the data coming from WikiData.
(MOB) Helped the mobile team on using React Contexts API and unified color palette.
(MOB) Reviewed the general syntax of HTML, React Native and JS within a sandbox environment with Emre
(BE) Introduced Bruno, an open-source Postman alternative that keeps the query and configuration data on the repository. Created a guide document about it.
(BE) Introduced different response codes to the backend team and regularized our error responses. This was sneaked into this PR

Challenges Faced:

• Dealing with Django backend + CORS issues was the primary issue of mine. To overcome the issue, I made some research, discussed it with team members and people from other groups. At the end we've concluded how to overcome it with Arayici and Ozan. Finally, we've switched to the workflow of running all the servers locally and we were able to spot the gap in our implementation.
• The back and forth between teams slowed me down on my primary responsibility, frontend development.
• I did not have a clear priority on my tasks, I overloaded myself with too much tasks from time to time.
• I did not prioritize my subtasks on frontend well enough and overengineered the visual aspects of the features. At the end we have reached a state-of-the-art ui designs but at the cost of one or two sleepless nights. At least we have got something that we can proudly show and demo.
• Dealing with Mantine UI at first was a bit tough, as I did not like the default styling of the basic components. Additionally, overriding those default styles was hindered by the fact that their respective order with TailwindCSS in PostCSS config mattered, of which I had no clue.
• I teamed up with Hasan Kerem in front-end, he was eager to learn new stuff. My responsibility also included the thought process behind my implementation to him. So we have written most of our code together.
• The tasks on the diagrams were inherently a litte bit vague. I opened the document but was struggling to add value into them. It was not all clear as to what to add, how to refine it etc. Diagrams were definitely my greates weakness on this milestone. I re ad through a lot of forum posts especially on user diagrams but I still found it difficult to add value to our documents. |
• All the issues I was assigned can be found here

Ozan Oytun Karakaya
Created UML Use Case Diagram for our application with Muhammed Emin Arayıcı based on team discussions, scenarios, mock-ups, etc.
Created UML Sequence Diagram for Post Searching after deciding its design in team meetings.
Updated the project plan with Muhammet Emin Çiftçi and Hasan Kerem Şeker so that it can reflect the implementation process of our three seperate teams. I was mainly responsible for revising backend the part of the project plan.
Revised and updated UML Diagrams according to most recent agreed format in the beginning of the implementation phase with Mücahit Erdoğan Ünlü and Hasan Kerem Şeker.
Learned about docker and docker-compose applications for the deployment of the project using lots of help of Docker Docs.
Created the Dockerfile for backend application, tested and deployed with Muhammed Emin Arayıcı.
Created the docker-compose file with Muhammed Emin Arayıcı after deciding to the structure of the application.
Fixed CORS problem on the backend application with Muhammed Emin Arayıcı.
Maintained the deployment machine and the application on it with Muhammed Emin Arayıcı by fixing bugs, managing resources, etc.
Helped Mücahit Erdoğan Ünlü for testing and finalizing the Swagger endpoint.
Revised the work of Yunus Kağan Aydın about connection between backend application and database server.
Revised latest developments before taking them to the production environment before milestone 2 with Emre Kılıç.

Challenges Faced:

• Docker applications was a new field for me to learn. I tried to stay as close as possible to best-practice habits during dockerization and deployment process, however, the time-pressure made me and my teammate got away from the best-practices sometimes. I will be planning my time in the next phase according to having the opportunities to implement best-practices with sufficient time for research.
• Since all of our backend team development was new to this field, we were focusing on the parts that are assigned to us while going through a learning process. This was also same for me about deployment works, thus, I couldn't participate to backend development side as much as I desired. Since the main scheme of deployment is now established, I will be also contributing to backend side more in the next phase.

Emre Kılıç
Fixed the acceptance criteria in the scenarios #146
Created the initial version of the class diagram with Hasan Kerem and Mücahit #133
Revised the sequence diagrams and helped Ozan to improve the Search sequence diagram #134
Added super classses to class diagram in order to control single elements like Users for User, Contents for Content #149
Researched how to develop a React Native mobile application #169
Bootsrapped the Mobile Application with vanilla React Native with Muhammet Emin Çiftçi and Arda #168
Migrated the Mobile project from vanilla to Expo #229
Researched for UI libraries and find the best library according to its ease to use and intuitiveness #207
Created the mobile project structure, added components and screens directories and introduced them to the mobile team
Added User context to the project using the Context API. This feature helped us to store User data in the runtime globally. Merged and then edited with PRs #243 and #260
Researched the navigation system in mobile development
Implemented the Tab navigation and bottom tab bar in the home page for the mobile application #232
Implemented initial versions of Feed page and Profile page. Those pages will be finished in the next milestone #211
Implemented the Stack navigation between Home page and Authentication pages #244
Edited screens and added styling to the pages #275
Implemented and styled the header components of the Feed, Search and Profile pages. Merged with #260
Implemented the search functionality and fetching the results with Muhammet Emin Çiftçi #315 Merged with PR #334
Added search category dropdown menu with Muhammet Emin Çiftçi Merged with #329
Designed the Infoboxes where the search results are appeared. Merged with #329
Added remember me checkbox and forgot password button to the Login page. Merged with #304
Connected sign up page with login page with Muhammet Emin Çiftçi and Arda #269
Researched local storage usage and API calls in mobile applications. Local storage helped us to store user data even if we reload the app
Added local storage functions and fetch methods according to the endpoints' methods (GET or POST) with Muhammet Emin Çiftçi and Arda #299 Merged with #300
Solved the problem that local storage remove function does not work sometimes. Merged with #337
Helped backend team to find out how to use Wikidata API effectively
Built the mobile application and solved the backend connection problem with Muhammed Emin Arayıcı #333
Revised latest developments before taking them to the production environment before milestone 2 with Ozan

Challenges Faced:

• The hardest challenge is the lack of experience in mobile development. None of us knows how to develop a mobile application. Thats why our progress started very slowly. We needed to figure out the basics. After some tutorials and trials, we found out how to start and did the planning. Then the progress is speeded up and we managed to finish tasks planned for this milestone.
• Another challenge was the backend connection. We store the inputs as string and send it to the backend as a JSON. However we then figured out that we should send a FormData which is a different version of sending JSON format. Frontend team has encountered such issue so it is easy for us to solve the problem in mobile side.
• Another challenge was the building the application. I personally never built an apk file so I needed to figure out the build options for android development. Our first build did not work and we needed a working build in a very limited time. We finally found the correct option with Arayıcı and built the apk file.

Hasan Kerem Şeker
Read React documentation
Read React Router documentation to create Example Routes
Created the initial version class diagrams with Emre Kılıç and Mücahit Erdoğan Ünlü.
Created the initial Sequence Diagrams which can be seen from the history tab of the sequence diagrams. It is the oldest version called Initial Sequence diagram draft
Bootstrapped the Frontend Application
Created Example Routes
Updated the Project Plan to include detailed subtasks of frontend, backend, and mobile teams with Muhammet Emin Çiftçi and Ozan Karakaya
Updated the Class Diagram to add missing methods and moved every database methods into their respective controller class with Mücahit Erdoğan Ünlü and Ozan Karakaya
Updated the Sequence Diagram to reflect changes of the class diagram and added search sequence diagram with Mücahit Erdoğan Ünlü and Ozan Karakaya
Created develop-web branch to separate production branch from the development branch which we push new features. The respective issue can be seen here
Determined subroutes and query parameters with Ümit Can Evleksiz
Created the Login Page and Ümit Can Evleksiz helped to do styling
Designed Initial Homepage and Ümit Can Evleksiz helped to do styling
Implemented custom keyboard focus styling with Ümit Can Evleksiz

Challenges Faced and Their Solutions: The hardest challenge I faced as a web development team member was the CORS error because it was the most time-consuming error. I first thought the issue was at the front end. Being not able to fix the error, Ümitcan and I had to ask for help. I asked the other group if they had the same problem and got some possible fixes. Ümit Can made meetings with the backend team. Eventually, the backend team tweaked their code to solve this issue. Another error was trying to send the right request data to the back end. We were sending the data using JSON.stringify method. However, this was not the right format. Ümit Can and I searched for ways to fix this issue. In the end, we found that we needed to send the formData directly instead of using JSON.stringify method. I had difficulties in the design phase. I spent too much time in the design phase because I had never implemented such a system so I did not know how to design one. I had to think and scrap the previous designs a few times. Consequently, this process wasted my time. On the other hand, I could not avoid this because I had to learn this somehow. The final challenge I faced was trying to keep up with Ümit Can on the web team. He is a very experienced front-end developer and tries to abide by the best practices. On the contrary, I did not have much experience in this field. My learning process might have slowed our team. Ümit had to explain different concepts to me. He was very patient while answering my questions and a good explainer. I am glad to be on the same team with him.

Ceydanur Şen
Contributed drawing use-case diagram with my team.
Researched how to write SPARQL queries for our wikidata search feature using wikidata SPARQL tutorial and implemented some basic queries to get familiar with it
Updated requirements to clearly explain semantic search with Wikidata API together with Mücahit Erdoğan Ünlü. issue. requirements
Implemented the search API endpoint, which utilizes Wikidata API to support semantic search, together with Mücahit Erdoğan Ünlü. issue
Implemented CRUD endpoints (GET,POST,PUT,DELETE) with Muhammed Emin Arayıcı
Created search mechanisms by using SPARQL for comics and comics characters to use for our search endpoint.
Created relational diagram to better understand our class diagram and database implementation with Mücahit Erdoğan Ünlü.
Added proper checks and status codes for the previous CRUD endpoints issue
Researched how to implement endpoints
Revised the class diagram with Mücahit Erdoğan Ünlü after creating relational diagrams and gave feedback.

Challenges Faced: The hardest challenge I faced was to learn a lot of concepts in a short amount of time. Even learning basics and implementing them took a lot of time. > Not being sure which way to implement our CRUD endpoints, we implemented CRUD endpoints first. However, we decided to use token-based endpoints for our project, so we had to implement the same thing twice causing unnecessary work for me. Also, I spent a lot of time implementing Wikidata search endpoint using character and comics queries, changing our search functionality we decided not to use this endpoint. A good solution for the challenge I faced would be to plan every step in detail before implementation part.

Mücahit Erdoğan Ünlü
Drew class diagram and sequence diagrams with multiple people.
Updated requirements to clearly explain semantic search with Wikidata API together with Ceydanur Şen. issue. requirements
Wrote unit tests for CRUD endpoints for the User model with Muhammet Emin Arayıcı. issue
Refactored the User model to inherit from Django's User model. issue
Implemented Login and Register API endpoints. issue
Wrote unit tests for login and register API endpoints. issue
Prepared a tutorial on how to write unit tests using Django REST's APITestCase. tutorial
Implemented the search API endpoint, which utilizes Wikidata API to support semantic search, together with Ceydanur Şen. issue
Prepared a tutorial on how to configure Swagger UI for the API endpoints. tutorial
Configured Swagger UI for login, register and research API endpoints. You can access the documentation for these endpoints here. You can view the issue

Challenges Faced and their Solutions:

• The design part was very confusing. Having no experience on developing a project that has database management, it was hard to designate the relationships with the database. However, after implementing User model with a UserManager (importing from Django), it has become clearer what a database manager does. Therefore, during implementation, we may need to update our class and therefore sequence diagrams.
• Being unaware of a strategy called test-driven development, I first implemented the functionalities of API endpoints. Writing tests after implementation is not effective. Besides, writing tests beforehand ensures that the implementation gives the correct outputs for specific inputs. From now on, I will use and encourage my team to use test-driven development strategy.
• Our initial plan for the use of Wikidata API for semantic search was rather hard to implement. It might not be stable and give the best results. Now, we decided to switch to a better and robust use of Wikidata API for semantic search and specified them in requirements.
• As a novice programmer and git user, I have problems with the use of programming tools most of the time. Since my teammates are user of these tools as well, I ask my questions to them.
• During the deployment of the web and building apk of the mobile, my teammates got security errors (corse error and usecleartextTraffic). As frontend programmers, they thought it is a problem on their side and they spent a lot of time to fix it. However, I asked the TA about the corse error and he said its solution is on the backend. By doing so, I did not solve the problem myself but provided my teammates the right way to solve it. As with usecleartextTraffic, I asked the right question on google and provided my teammates the right way to solve it. All in all, asking (the right) questions to (the right) people is important to solve the problems.

Arda Vural
Updated the Responsibility Assignment Matrix and my personal efforts. issue
Researched and learned how to create a use-case and class diagram using tutorials. issue, issue
Contributed drawing use-case diagram with Ozan Karakaya. issue
Bootsrapped the Mobile Application with vanilla React Native with Muhammet Emin Çiftçi and Emre Kılıç. issue
Researched for UI libraries to find the best library according to needs with our purposes with Emre Kılıç. issue
Created sequence diagram for following user with Yunus Kağan Aydın and Muhammet Emin Çiftçi. issue
Created sequence diagram for "Create Post" with Mücahit Erdoğan Ünlü. issue
Contributed implementing home page in mobile App with Emre Kılıç. issue
Researched the navigation system and contributed to implementing it in mobile development with Emre Kılıç. issue
Created CustomButton and CustomInput components to use in login, register and home pages.
Created specific fetch components to ease the use of it. issue
Implemented login page in mobile App. issue
Added styling for login page and CustomInput, CustomButton components.
Connected login page with sign up page using navigation with Muhammet Emin Çiftçi and Emre Kılıç. issue
Researched local storage usage and its libraries to use which fits the most for our project. issue
Implemented local storage functions in mobile App, which helps us to store the data in local storage and use it even if we reload or reopen the app. The Issue issue
Researched fetch functions and shared it with Muhammet Emin Çiftçi and Emre Kılıç. issue
Implemented fetch method according to the endpoints' methods (GET or POST) with Emre Kılıç and Muhammet Emin Çiftçi in mobile App. issue
Implemented "Remember me" feature in mobile app and connected it to the button. issue
Implemented theme provider in mobile App. This feature helped us using consistent theme for our whole app. issue

Challenges Faced:

• Trying to local storage functions to use "Remember me" function was a challenge in the beginning. I have started to code without making any proper research and plan. After some time, I was in a unsolvable situation where i needed to start again. Not making any plans and research even if the task is small was a mistake and it made me lose more time than i would spend for planning. Then I started from the beginning and made my research and plan. In the end, task was way shorter then i expected.
• Also, these small problems took much more time than it should have taken because of lack of experience in mobile development. In the mobile team, All of us started to project with zero experience and knowledge. That situation made harder even planning. So, we spent some time in basics, which made us slower. Due to that, Solving even small problems was too much time-consuming for us.

• We were not accustomed to designing diagrams as we were with the implementation. As we move towards the further steps of implementation, we think we will be more aware of what we are building and therefore can be more insightful about the design of our solution.
• We have faced the CORS problem few days before our final deployment, which was telling us the fact that a forecast about possible problems should be conducted in earlier development processes.
• Mobile application builds took longer time than expected after few trials(due to expo queue problem), which should be managed better in the next phase.
• Wikidata comprehensive study as a team is required for the development process of our application's semantic post search implementation methods, especially for queries.
• Concepts such as backend authentication was not researched very well in the beginning of the implementation causing re-implementation of user model. Other concepts will be researched deeply in the next phases.
• API endpoint and response schema was developed by backend team, however, since general schema was not conluded by all teams, it caused few delays on development process.
• Adopting SwaggerUI was a bit too late, resulting in a lack of sync within the teams for communucating the endpoints.
• We haven't yet implemented the "Test Driven Development" approach. Though we have some unit tests, they are written only after the relevant functionalities are implemented.
• Frontend team was lagging behing most of the time throughout the development process. This can be somewhat justifiable by just looking at the head count.
• We had the mentality of "Form over functionality" on frontend sometimes.
• Tools for monitoring & developing frontend, backend and mobile sections are planned to be setup on every team member's development environment in order to increase the comprehensive knowledge about the application of all members.
• Responsibility Assignment Matrix was not filled when the distributon of tasks are made.

• Responsibility and availability of the team was high level.
• Issue usage was as good as the first milestone, if not better. We have resolved over 200 well described issues.
• We made use of Pull Requests really well, closing 52 in total.
• We mostly avoided committing directly to main. We have well utilized development branches. Our PRs have many contributors, and one had 7!
• Our application has a very professional design, look and feel overall. It also has a clear purpose and problems in mind from the getgo.
• All 10 team members were again quite reliable when it comes to finishing the tasks.
• Everyone was in the call, or known to be unavailable beforehand
• We mostly did not miss deadlines. The tasks assigned during the meetings were completed on time.
• We were not afraid of using Typescript, without prior knowledge on even Javascript.
• We all had ownership of responsibility across different parts.
• We assigned writing readme files to a non-team member so that we could all understand what was going on other teams. For instance, Mucahit (BE) has written the FE readme, and Ümit (FE) has written BE readme with Arayici.