Tradeverse Customer Milestone 1 ‐ Report - bounswe/bounswe2024group10 GitHub Wiki
- We have decided on the community/topic which our application will be about. It is finance, since we have some of the group members which are a part of the community and helped developing other finance based applications.
- We have decided on the features we will add to our application which will give a fulfilling experience to the user. More info about it can be found on draft of the forum and community features pages.
- We have written many mock scenarios about the new features we want to add into our application.
- We have written requirements according to the features we want to add, common forum features and some standards we wanted to implement.
- We have designed mock-ups according to our requirements to determine how the UI would look.
- We have made database, class, use-case, sequence diagrams to determine how we would implement the backend.
- We have written the endpoints for user details, validating tokens, register & login.
- We have written the docker-compose file for our server.
- We have initialized the mobile application.
- We have done many deliverables which will be talked about in the 1.3 subsection.
During the Customer Presentation 1, Gülşen, Melih and Hüseyin were presenters. We have started to show our project with web, and then mobile part.
Presentation was quite successful for our team. We have implemented many pages both in web and mobile parts. Therefore, we could be able to show the purpose of “Tradeverse”. Customers like the presentation totally.
However, this presentation was our first presentation for the “Tradeverse”. As a result of this, we did not apply all the requirements and pages. Thus, we have some missing parts in our application.
Customers asked for more about comment part of the threads. Currently we have comments, utilized mock data, but, we have not implemented the comment on a comment. Customers asked about comment on comments feature, and we explained that we will implement this feature for the upcoming milestones.
Another point Customers mentioned about is that she asked for bookmarking any thread or topic in the forum. We did not put bookmark option similar to like or unlike feature as a design choice. However, we implemented this by adding follow and unfollow mechanism. When users want to see more about one topic or a person, they can follow this topic or the person so that they can see the threads about the topic and the person. We have explained our implementation and logic of the bookmarking, and customers satisfied.
Lastly, Customers asked for semantic search, and told that we need to pay more attention to semantic search. We have not implemented semantic aspect of “Tradeverse”, but, it is in our future works.
Overall, the presentation was quite fruitful, but we have some point to give attention from the feedback of the presentation.
Deliverable | Status | Link |
---|---|---|
Project Repository | Completed | Repository |
Requirements Spec | Completed | Requirements |
Scenerios | Completed | Scenerio-1, Scenerio-2, Scenerio-3, Scenerio-4, Scenerio-5, Scenerio-6 |
Mockups | Completed | Mockups |
Responsibility Assignment Matrix | Completed | RAM |
Communication Plan | Completed | Communication plan |
Meeting Notes | Completed | Meetings |
Issues | Completed | Issues |
Project Plan | Completed | Project Roadmap |
Diagrams | Completed | Sequence Diagram, Class Diagram, Use-Case Diagram |
Overall, our project is progressing well, with foundational elements implemented on both the web and mobile platforms. Core features such as user authentication, feed display, and subforum navigation are in place and functional. While the current data are mock implementations, this gives us a valuable preview of how the app will look and operate, helping us test and refine the user interface and experience.
On the web platform, we've successfully built a basic structure for user interactions, including login/logout, feed sorting, subforum navigation, and post page display. The groundwork is solid, but the lack of real-time data integration and limited support for nested comments indicates some limitations. As we transition from mock data to actual data integration, it will be essential to address scalability and load management to enhance the user experience.
For the mobile app, we’ve expanded upon the web features with additional sections, including separate feeds for "For You," "Followed Subforums," and "Followed Users." The user profile, portfolio, asset pages, and search functionality are implemented, although currently only mock data populates them. This provides a good foundation for extending personalization features but will need considerable backend support to function fully.
While the implemented features mark good progress, the heavy reliance on mock data is a current limitation that impacts our testing accuracy. Additionally, features like nested comments, search functionality, and new post creation are incomplete or nonfunctional. Completing these will require focused development on backend integration and real-time database support, which we should prioritize in our project plan moving forward. Shifting focus to implement database connections and API endpoints for live data should be a primary goal in the next phase.
For creating the sequence diagrams we used the Mermaid language. Learning it was quite easy since the tutorial for creating sequence diagrams with it is really clear. Also the language itself is optimal for creating the sequence diagrams because the creator writes the codes downwards in the same order as the messages and replies as the diagram thus making it easy to follow the flow.
However, for creating the use case diagram and the class diagram we used draw.io since it was easier to handle the many connections/relations between elements by drawing it by hand, moreover creating more complex connection based diagrams is easier if the creator can see the big picture while creating the diagram because they can avoid mistakes better.
Our main communication channel was Whatsapp because everyone can immediately see a message, which helps in urgent scenerios. We also used independent subgroup Whatsapp channels to communicate subgroup related things. Moreover, by listening to the feedback, we started using issues more actively, using them for discussion spaces helped us focus on topics clearly and follow the progress of each task.
For the project plan we used ProjectLibre. ProjectLibre makes adding tasks and interdependencies and seeing the order of tasks really easy. Moreover, being able to add tasks while seeing the chart itself makes it easier to follow the flow while creating it.
Teammates can easily review their old works, worked with whom and how much time spent while doing the work. Here is the link for screenshots of the plan, here is the link for the code.
We used Java Spring for our backend framework, decision was almost unanimous, because most members were more experienced in Java's class structure rather than Python's. Also the team members who are knowledgable in Java Spring were able to teach the other backend subgroup members' the ropes effectively.
For the database MySQL was chosen unanimously over PostgreSQL thanks to its ease of use. Moreover, most members were more familiar with MySQL making operating with it better for the group.
We used React for developing our web application's frontend. Our main reason for using React is its user-friendly developing environment .Moreover, React is supported by a large community, providing developers with extensive documentation, guides, and helpful resources. Additionally, numerous third-party libraries and tools further facilitate the development of React projects. Finally, React's JSX syntax offers an HTML-like structure, enhancing code readability and comprehensibility. This boosted our productivity and ensured consistent coding practices throughout the project.
Also, we used react-native for our mobile application. React Native is a powerful framework for building cross-platform mobile applications, supported by a vast community and major industry players, resulting in a dynamic ecosystem and regularly updated libraries. Its component-based architecture allows for the modular development of mobile apps, ensuring reusability of components for cleaner and more maintainable code. This feauters of react-native have helped us a lot during the coding part of our mobile application.
We used DigitalOcean for our cloud computer. Thanks to DigitalOcean's 200$ gift card, we were able to rent a relatively good computer for running our application.
We have put emojis before every requirement at requirements:
- ✅ is for requirements that we finished implementing it.
⚠️ is for requirements that we have started working on but not finished.- ❌ is for requirements that we have not started.
For our initial prerelease, version v.0.1.0, we have implemented significant features and provided essential documentation to facilitate development and usage:
This release marks the completion of key functionalities essential for user registration, authentication, and basic search capabilities.
We created v.0.1.0 as a Github prerelease which can be seen here.
Also, you can view our app at Web App
- Leading backend development efforts.
- Setting up and initializing the Spring Boot project.
- Implementing backend endpoints for user registration, login, and retrieval of user details.
- Designing and implementing follow/unfollow functionality.
- Creating endpoints for retrieving followers and followings.
- Preparing class diagrams to define backend architecture.
- Maintaining project documentation, including the README.
- Dockerizing the project for consistent and efficient deployment.
- Managing deployment of backend services on Google Cloud Platform for scalability.
- For Milestone 1, I led the backend development by setting up the Spring Boot project and implementing key user authentication endpoints. I also handled the Dockerization of the application for smoother deployment and ensured comprehensive documentation in the README. My contributions in the design phase included class diagrams that supported team discussions and architectural decisions.
Task Name | Related issue | Related PRs |
---|---|---|
Initialize Spring Boot project | #239 | PR |
Implement register endpoint | #261 | PR, PR |
Implement login endpoint | #261 | PR |
Implement user details endpoint | PR | |
Implement follow/unfollow endpoints | #331 | PR |
Implement follower/following endpoints | #331 | PR |
Add README | #263 | PR, PR |
Dockerize project | #246 | PR |
Task Name | Related issue | Explanation |
---|---|---|
Prepare class diagram | #254 | Designed class diagrams to define the structure and relationships of backend components, improving the team's understanding of the architecture. |
Deploy to Google Cloud Platform | Managed backend deployment on Google Cloud, ensuring high availability and scalability of the services. |
- Initialize Spring Boot Project and Dockerization
- Implement authentication endpoints
- Implement user details retrieval
- Implement follow/unfollow and follower/following endpoints
- Add README documentation
- Creating necessary mobile screens
- Attending mobile meetings
- Deciding the UI/UX design of the mobile application
- Helping for creation of app skeleton with mobile team
- Helping for sequence diagram creation
- Deciding on community features
- Organizing requirements
- Draw mock-ups for mobile
- My main contributions for Customer Milestone 1 are creating necessary mobile screens with their mockups, editing their UI/UX designs, helping for creation of sequence diagrams; as well as organizing our application requirements, deciding on our community features, organizing our GitHub milestones and Wiki page, and opening corresponding issues for all these tasks.
Task Name | Related Issue |
---|---|
Followed Users Screen | #292 |
Portfolio Screen | #289 |
Subforum Screen | #291 |
Post Details Screen | #290 |
Task Name | Related issue |
---|---|
Sequence Diagrams | #255 |
Create Milestones & Project | #218, #245 |
Lab Reports | #201, #236 |
Community Features | #149 |
Mockups | #243, #247 |
Requirements Organization | #232, #228 |
- Initialize the web project
- Write the dockerfile for web project
- Create the basic routing for web app
- Create the readme file for development environment setup
- Create the subforum navigation bar
- Create postHeader component
- Revise post component
- Create comment component
- Design and implement post page
- Create user scenario
- Create use case diagram
- Contribute to requirement analysis discussions
- Review web dev team's pull requests
I contributed to the development of the web pages. I first initialized the React web project and wrote a readme file about development environment setup. I also implemented the dockerfile for the web app. I created the use case diagrams with Yasin Atlı. I contributed by writing a user scenario. I created subforum navbar, post page and comment components. I revised some parts of the feed page as well post component.
Task Name | Related Issue |
---|---|
Revise feed page UI | #344 |
Create Post Page | #343 |
Create Comment Component | #342 |
Create pageHeader Component | #340 |
Dockerize Web App | #251 |
Initialize React Project | #250 |
Task Name | Related issue |
---|---|
Use Case Diagram | #256 |
Design Web Logo | #341 |
- Creating necessary mobile screens
- Attending mobile meetings
- Deciding the UI/UX design of the mobile application
- Creating app skeleton with mobile team
- Creating sequence diagram
- Writing and organizing requirements
- Organize wiki and repository
- Create a user scenario
- Draw mock-ups for mobile
- Present the customer presentation
- Contributions for Milestone 1 included the development of mobile screens and mock-ups, structuring of UI/UX workflows, and the creation of sequence diagrams to support design clarity. Additionally, I organized requirements documentation, maintained the project wiki and repository, and presented project progress to the customer.
Task Name | Related issue | Related PR's |
---|---|---|
Create "Asset Detail" Screen | #286 | PR |
Create "Profile" Screen | #285 | PR |
Create "Add Portfolio Asset" Screen | #283 | PR |
Create "Followed Subtopics" Screen | #282 | PR |
Create "Login" Screen #281 | #281 | PR |
Create "Register" Screen | #280 | PR |
Create "Create" Screen | #279 | PR |
Create App Skeleton | #267 | PR |
Task Name | Related issue | Explanation |
---|---|---|
Write mock scenario 2 for determined topic | #208 | Developed a second user interaction scenario to test and refine the user experience for specific app functionalities. |
Write the meeting notes of the Oct 1 lab session | #219 | Documented key discussions, decisions, and action points from the Oct 1 lab session for team alignment and reference. |
Write user requirements | #211 | Created detailed user requirements to clarify expected app functionality and guide development processes. |
Write Meeting Notes | #229 | Summarized meeting discussions and decisions to keep the team informed and provide a record of project progress. |
Correct User & System Requirements | #234 | Reviewed and updated requirements to ensure accuracy, completeness, and alignment with customer expectations. |
Mobile App Set Up | #241 | Established the initial setup for the mobile app, including configuring dependencies and development environment. |
Creating Mockup Screens for Mobile | #243 | Designed mockup screens to visualize app layouts, guide development, and gather feedback on UI/UX from stakeholders. |
Document Mobile Meeting Notes | #244 | Recorded key points from mobile-focused meetings to ensure team alignment on app design and feature development. |
Create Sequence Digrams | #255 | Developed sequence diagrams to illustrate user interactions, app workflows, and data exchanges within the app. |
Discuss About Customer Presentation 1 | #258 | Planned content and structure for the first customer presentation to effectively communicate project progress. |
Discuss on semantics aspect of the project | #259 | Engaged in discussions about the semantic aspects to align project terminology and improve communication accuracy. |
Document Third Mobile Meeting Note | #278 | Compiled notes from the third mobile meeting to track progress and decisions regarding mobile app development. |
- Create "Create" screen
- Create Login Screen and Register Screen
- Create Add Asset Screen
- Create Asset Detail Screen
- Create Profile Screen
- Text out of Text component error, Missing Global Screen component
- Create Followed Tags Screen
- Create Login Screen and Register Screen
- Delete expo boilerplate and build app skeleton
- Add Asset Results View into search results screen
For the customer presentation, I collaborated closely with team members to prepare and organize content, ensuring it aligned with project objectives and met customer expectations. I developed a structured presentation covering key aspects, including project progress, current milestones, and upcoming tasks. I have presented the presentation to the customer, explaining each section in detail and gathering valuable feedback to guide the next steps in the project. Also, as a team we have answered customers questions.
- Creating mobile application screens.
- Creating the UI and UX design of the mobile application on figma.
- Giving insight as backend response formats by designing the application.
- Attending mobile meetings
- Creating app skeleton with mobile team.
- Creating sequence diagram.
- Organize wiki and repository.
- Create a mock user scenario.
- Draw mock-ups for mobile.
- Attend the presentation as app user on Milestone 1.
- I have designed the whole structure of the mobile application on figma and distributed tasks among mobile team members. I also mainly directed the mobile development process, reviewed codes and deciding on codebase design. I also discussed how the project will be structured for semantics search closely with backend team.
Task Name | Related issue |
---|---|
Create "Search Results" Screen | #284 |
Create "Explore" Screen | #277 |
Create "Add Subforum" Screen | #276 |
Create "Add Post" Screen | #273 |
Create "Profile Edit" Screen | #274 |
Create "Account" Screen | #270 |
Create "Home" Screen | #272 |
Create “Welcoming Screens” | #271 |
Create App’s Skeleton | N/I |
Task Name | Related issue | Explanation |
---|---|---|
Semantics Of The Project | #259 | Discussed the semantics structure of the application closely with backend team in order to provide clarification. |
Create Sequence Diagrams | #255 | Contributed to developing sequence diagrams to illustrate user interactions, app workflows, and data exchanges within the app. |
Drawing Mockup Screens for Mobile on white paper. | #243 | Designed mockup screens to visualize app layouts, guide development on paper sheets. |
Documented Second Lab’s Report | #217 | Documented the report of the second lab report. |
Create Mobile App’s Skeleton | #243 | Created the main layout of the mobile app to provide our mobile team to give a cleaner development process. |
Mobile App Set Up | #241 | Created the expo mobile app and informed team basics on react native. |
Creating Mockup Scenario | #207 | Created MockUp scenario that simulates the beneficial usage of the application. |
Discuss About Customer Presentation 1 | #258 | Planned content and structure for the first customer presentation to effectively communicate project progress. |
Created App Release |
- Delete Expo Boilerplate code and build app skeleton.
- Create Account Screen
- Create Add Asset Screen
- Create Home Screen
- Create Explore Screen
- Create Search Results Screen
- Create Welcoming Screens
- Profile Settings Screen
- Post Creation Screen
- Subforum Creation Screen
- App Navigation And Link Flow
- Mock Data Usage on App
- Mobile App Authentication
- Splash Screen Showing
- Development on the backend.
- Revising Backend endpoints to provide better implementation.
- Write Milestone-1 Report
- Organize wiki and repository
- Create a user scenario
- Talking to teacher/TAs for better implementations
- Talking many times with TA/teacher about our project
- Taking some of the meeting notes
- Writing a meeting note
- Attending meetings
- Determining user features
- Writing the draft of the requirements
- Wrote a mock-up scenario
- Making the DB diagram
- Attending the meetings
- Reviewing pull requests
- Writing Milestone-1 report
- Taking an active role in the decision making process
Task Name | Related issue | Related PR |
---|---|---|
Write the docker-compose file | #233 | - |
( I was sick and was not able to do it.) |
Task Name | Related issue |
---|---|
Acquire information | #212 |
User Features | #216 |
Create a Mockup Scenario | #220 |
Draft of the Requirements | #222 |
Feature Based on Moderation | #230 |
Create Database Diagram | #235 |
Discuss on semantics | #259 |
Write Milestone-1 Report | #336 |
Addressed Requirements | #338 |
Writing meeting notes | #339 |
None
Even though I was very active before my illness, I was not able help much while I was ill. Because of this I will try to be more active on the next milestones.
- Update wiki page, create archive for animal trove project. Update personal pages. Move templates and updated personal pages to the wiki page.
- Help to determine project topic.
- Help to create communication plan and general plan
- Revise lab reports.
- Create mock-up scenarios for the project.
- Create class diagrams
- Modify requirements.
- Create responsibility assignment matrix.
- Write the section “A summary of the customer feedback and reflections” part in the milestone-1 report.
- My main contributions are creating mock-up scenarios, creating class diagram, creating RAM, and helping to write milestone-1 report. I am also in the backend team, so I have reviewed some codes from the backend.
Task Name | Related issue | Explanation |
---|---|---|
RAM | #338 | --- |
Project plan | #338 | --- |
Milestone-1 report | #338 | write summary of the customer feedback and reflections |
semantics aspect of the project | #259 | discuss semantic aspect of the project. What kind of parameters will be play role on the semantic search results. Additionally, discuss the way how post contents are going to obtain the tags. |
Customer Presentation 1 | #258 | discuss about Customer Presentation 1; for example, what would we present, who will present, etc. |
Requirements | #257 | Modify Requirements According to user tags |
Class Diagram | #254 | create Create class diagrams for our forum as the backend team |
Mock-up Scenario | #224 | Create Mock up scenario for our financial forum |
General Plan | #206 | talked about our roadmap (communication methods, using GitHub efficiently, project domain preference, etc.) |
Lab Report | #205 | First lab report was revised. |
Update Wiki pages | #200 | Update the personal pages. Update the sidebar. Create an archive tab. Move the templates and personal pages to the updated wiki. |
- README, reviewed.
- Implement authentication, reviewed.
- Initialize Spring Boot project, reviewed.
I was take notes during the customer 1 presentation. By utilizing these notes I have written the section “A summary of the customer feedback and reflections” part in the milestone-1 report.
- Development on the frontend.
- Revising Backend endpoints to provide better implementation.
- Write Milestone-1 Report
- Implemented Authentication on the frontend.
- Implemented Routing on the frontend
- Implemented Validate token end point on backend.
- Created login page for frontend.
- Created signup page for frontend.
- Revised the backend codes.
- Created Home page component.
- Created feed on frontend.
- Created Mock Data for frontend implementation.
Task Name | Related issue | Related PR |
---|---|---|
Implement Authentication Wrapper (AuthWrapper) | #303 | Implemented Authentication, Routing, and Forum Structure Enhancements |
Create Login & Register Pages for Web | #304 | Implemented Authentication, Routing, and Forum Structure Enhancements |
Create Forum Components | #305 | Implemented Authentication, Routing, and Forum Structure Enhancements |
Implement Routing | #306 | Implemented Authentication, Routing, and Forum Structure Enhancements |
Implement validate-token Endpoint | #307 | Implemented Authentication, Routing, and Forum Structure Enhancements |
Task Name | Related issue |
---|---|
Update Wiki pages | #200 |
Create 7'th MockUp scenario | #223 |
Create a glossary for our project requirements | #227 |
Rearrange Requirements and Divide into Subsequent Sections | #228 |
Correct User & System Requirements | #234 |
Revising Lab Report | #242 |
Create Use Case Diagram | #256 |
Write Milestone-1 Report | #345 |
- Revised initialization of the web project
- Implemented Authentication, Routing, and Forum Structure Enhancements
- Web
- Attending Web meetings
- Deploying docker
- Contributing in use case diagram creation
- My main contributions for Customer Milestone 1 are on the front-end part of the code. Together with my teammates we initialized the web project and wrote the necessary dockerfile. We also created page headers, navbars, feed page, posts and comments.
Task Name | Related Issue |
---|---|
Create Post Page | #343 |
Create Comment Component | #342 |
Create pageHeader Component | #340 |
Task Name | Related issue |
---|---|
Use Case Diagrams | #256 |
Lab 4 Report | #253 |