Used Technologies - bounswe/2021SpringGroup12 GitHub Wiki
Used Technologies
Android
We have used Android Studio as the IDE and Java as the language of the implementation. The Android Studio is the recommended IDE by Google and it has support for many things that we needed during implementation like an ADB manager that we can use to deploy our app to a real android device and debug it or like an internal visual VCS connection tool and many more.
As for using Java as the implementation language, we didn't have any problems with it. Since we all knew Java we didn’t want to bury ourselves under another burden of learning Kotlin and using it. Everyone in the team is comfortable with Java and could complete the tasks given so far. Besides these choices, we created a base structure for the Android application.
Since we needed a home page that we can display the hierarchy to the user and other pages, for usability’s sake we created a bottom navigation bar and a navigation hierarchy like the instagram’s app. In this hierarchy the users can go deep in the hierarchy and come back using a stack like structure. For being able to create this structure we used an Activity as the main activity and container Fragments for each page connected to the bottom navigation bar. Later we created a fragment base which is called BaseInnerFragment that the other fragments to be displayed in a hierarchical view should extend. These BaseInnerFragment instances will be placed into the container fragments. So we have a structure that can be extended horizontally using the bottom navigation bar and adding new container fragments as well as it can be extended vertically using inner fragments and adding them to a container fragments stack.
For easier implementation in future BaseInnerFragment contains necessary methods as ‘protected’ so child fragments extended from it can access and use them. A few examples to these functionality provided from BaseInnerFragment to it’s childs are changing the top bar’s visibility and it’s button’s functionality, opening and closing fragments from the stack, access to the network service api etc. This is a design pattern called Sandbox and it has been proven useful to us so far. By using these patterns and structures we were able to create a structure with a dynamic number of pages(as our application requires), and complete the implementation of many different views and merging them in such a short time(1 week). Also since our structure is dynamic we can modify it quickly according to our customers’ needs and reviews.
Using this structure also allowed us to share the pages to be implemented between team members, implement them separately and later connect them without having big problems or the need to change existing code so much.
- Java - Implementation language
- Android Studio - IDE
- Git - Version Control System
Backend
We used whatsapp as our main communication channel, Java as our main programming language, Spring Boot as our web framework, PostgreSql as our database management system, IntelliJ as our IDE, Swagger as our API documentation tool and git as our version control system. Since our team consists of two people. We do talk about the little details on Whatsapp. But if the subject is important and needs careful consideration, we use Discord. We reach each other instantly via Whatsapp, we specify a special hour beforehand for discord meetings. Screen sharing and voice channel functionalities of Discord are amazing. We are satisfied until now, and do not see any reason to switch these channels.
We decided to use the Spring Boot framework since both of us knew it well. Main reason was minimizing the learning time and maximizing the implementation time. Spring Boot also has a great community and we found solutions to almost all of the problems we faced. So far we are happy that we chose Spring. Libraries like Lombok, mapstruct easened the implementation process and saved us from hundreds of lines of code. Also other libraries and frameworks like Junit4, sun-mail, spring-fox swagger helped us to achieve the ultimate goal. Also Spring boot easily integrates with the database with JPA and annotations (starting with @) ease the implementation process.
PostgreSql is used as the database management system in the project, since we are used to working with relational databases and worked with Postgres before. It easily integrates with the Spring Boot. Also we did not encounter any problem while dockerizing and deploying. We are glad we chose Postgres.
IntelliJ is probably by far the best IDE for java projects. It has a built-in terminal, vcs, database explorer, and http client. We used the built-in terminal for git pull-commit-push operations. built-in vcs for resolving conflicts on merges, database explorer for playing with database, and even tested endpoints with built-in http client. It’s a great tool and contains most of our needs. We are glad we can use this tool for free with the student license.
Postman is an API testing application. We used it for testing our endpoints frequently. You can save a request to a collection and order them as you like. Configuring the body, header or parameter of the requests is very simple.
During the implementation, we used git as a version control system. We created dev branches for each team. Also we branched out from these dev branches for every feature we implemented. After implementing a feature, we opened a pull request wanting to merge with the dev branch. After merging all code in dev branches, we wanted to merge to main branches, but we didn't have the time to do that. Git is great for collaborative work, our job is much easier with it.
- Java - Implementation language
- Spring Boot - Web framework for Java
- PostgreSql - Database Management System
- IntelliJ - IDE
- Postman - API testing application
- Git - Version Control System
Frontend
After the first meeting, we decided to use React for frontend development. Ahmet Berat is experienced in this framework, Batuhan and Ömer had no experience in frontend development. One of the main reasons for selecting this framework is that it is open-source, widely used, and easy to understand and develop applications.
After selecting a framework to develop the frontend, we decided to use Ant Design for the UI framework. It is said to be "The world's second most popular React UI framework" on its website. It is easy to use pre-implemented components such as login form, register form, buttons, and some other forms for our frontend project. There is no need to rediscover America!
We used the Route component from react-router-dom to connect pages and components. With routing, we can send some parameters such as goal_id, entity_id to other pages. Thanks to this feature we were able to split the work and everybody was able to work on their work. While creating our pages we needed data to show users. Since the backend was not implemented yet, we used mock data. To use mock data, we implemented a basic Flask backend without any database connection. To send get, put, delete, post requests to the backend, we used the Axios library. It is one of the most popular libraries for sending HTTP requests and it is easy to use.
After the backend was implemented, they shared the IP and swagger page with us. We changed our requests to connect to the backend. To change requests properly, we used the swagger page that was shared with us.
While doing all these developments, we used git as the version control system. We had frontend/main, frontend/dev branches. The first is for a stable frontend version, the second one is for merging new features. We all created new branches from frontend/dev. After implementing features assigned to us, we created pull requests on git and merged them.
We used Visual Studio Code as code editor. It is the best and easy to use editor for developing React applications. It has lots of extensions to ease developers’ jobs. We used an extension called Prettier Code Formatter which is used for formatting the code to increase readability. It sets the indentation automatically. We also used an extension called Typescript React code snippets. It is used for creating initial code snippets for React Typescript function based or class based components. It is very helpful for beginner React developers. We used another extension called Git Blame. It is used for knowing the author of every line in the code. It also tells us when this line was created and what was the merged pull request. VS Code is a great tool for web development and it has many extensions that we will need in the future.
- Javascript - Implementation Language
- React Typescript - Frontend Framework for JS
- Ant Design - UI framework for React
- Git - Version Control System
- Visual Studio Code - Code Editor
- Prettier Code Formatter - Visual Studio Code extension for code formatting
- Git Blame - Visual Studio Code Extension for VCS usage