SocialStuff

TODOs

• Jörn & Maurits:
  • connect services
  • implement handshake
  • fix minor issues
• Malte & Tobias:
  • admin panel (invite links)
• Dave:
  • todo

Project Roles

• Product Owner: Jörn Neumeyer
• Project Management / Scrum Master:
  • Tobias Jansen
  • Maurits van der Zee
• Quality Management:
  • Dave Hoevenaars
• Frontend Developers:
  • Malte Castner [Github]
  • Dave Hoevenaars [Github]
  • Maurits van der Zee [Github]
• Backend Developers:
  • Tobias Jansen [Github]
  • Jörn Neumeyer [Github]

Introduction

– Add a detailed introduction on what socialstuff is all about –

Project Management

• Changelogs
• Project Management Plan [Source]
• Project Charter [Source]
• Work-breakdown-structure (WBS)

Analysis

Use cases

• Use case diagram [Source]
• Use cases for user
• Use cases for admin

High level architectural overview

– Add a description how socialstuff will work (high level, client Alice/Bob, multiple servers, etc.) –

Design

– description to be added –

Sequence diagrams

• Send message (best case) [Source]
• Send message (worst case) [Source]
• Send file [Source] – create diagram –

State machine diagrams

• Message [Source]

Technology Stack

Finding the right technology stack for a project is a major part of the overall process of realizing a project. Multiple considerations should be taken into account which we will cover in this section. This section is a detailed of which technology stack we have gone with and why.

Factors taken into account

• Keep it simple and agile
• Project requirements
• Open-source technologies
• Ecosystem
• Long-term trends and support
• Final technology stack

Keep it simple and agile

Finding a proper technology stack starts with deciding a fitting solution for the actual context in which the project should be realized. As the project will be developed in a short-term project of 5 months within software factory (SOFA) at Fontys Venlo we had to go with an agile as well as easy to start with technology. This enables all team members to get started quickly as well as to adapt accrodingly if something does not work out as planned.

We started with a small concept and some sketches of how the product could look like. The actual set of features was not fixed at this point in time. We knew that the project scope would change during the project phase. That’s why it is even more important to choose for an agile technology.

Project requirements

As the project is focussing on secure as well as fast communication between several users across the internet, we wanted to choose a technology stack that supports various system platforms as well as easy migration possibilities for a later stage of the project. This would allow us to adapt our developed parts to be translated to further platforms and devices. As more than 60% of all users are accessing the internet via mobile devices the focus should also lie on technologies which are fully supported by mobile platforms and devices.

As security and privacy are our core principles we needed to take this into consideration for our technology stack. Our focus was set to various technologies which have been around for quite some time already so we can be sure that major security vulnerabilities have been eliminated beforehand.

Open-source technologies

Going with open-source technologies provides multiple benefits. First of all it enables to project team to focus on the business part of the application. Most of time, there is already a good open-source solution for general tasks like front-end frameworks, database systems or encryption algorithms. Those implementations enables the team to safe a lot of time as the components do not have to be developed by ourselves. Last but not least are those already implemented solutions more secure as more people have their eyes on it and report and fix bugs.

Ecosystem

As a result of the larger community of open-source technologies a better ecosystem will go along with it. Important for using open-source software is, that it is properly documented and that is already known in the community. This helps with later bug fixings and solution findings. The more people using a technology the more questions and answers will be available on sites like Stackoverflow or Github forums.

Furthermore, there will be more thrid-party components and solutions available (for example via npm (node package manager)).

Long-term trends and support

Lastly, a detailed look on the long-term development of available technologies should be considered. As said before we should aim for mature technologies as they are more robust, reliable and most of the time also more secure which is crucial for this project specifically.

Final technology stack

Taking all the above listed considerations into account we have come up with the following technology stack for our SOFA project:

Frontend

• Electron
  We decided to go with Electron as it enables us to develop one solution which can be deployed across several platforms including Windows, macOS and Linux. As Electron is not that difficult to include into a default setup we decided to utilize the technology as this increases the target group significantly.
• Angular We decided to go with Angular as major front-end framework. It enables us to handle data efficiently between several components. Furthermore, it comes with useful features, for example to dynamically re-render views if the displayed data changes.
• Angular Material
  Angular Material provides us with a comprehensive UI library. The library shippes with preconfigured elements such as buttons, menus, navigation options, form fields and many more.
• SCSS
  To complete our front-end stack we utilize SCSS. It provides additional funcationallity like variables, nested operations and it makes it possible to dynamically render themes for Angular Material.

Backend

• Node JS

TODO explain backend technology stack

Visual Design

– description to be added –

Please refer to the below listed files for more details.

• Styleguide
  • Grid & Measurements
  • Message Styling
  • Message States
• Color palettes
• Wireframes

Implementation

– description to be added –

Frontend Components

– TODO –

• Auth
  • Register – TODO –
  • Login – TODO –
  • Forgot Password – TODO –
• – TODO –

Services

– TODO: add description –
– TODO: more services to be added –

• List of ports

Backend services / APIs

• Authentication service – TODO: file to be added –
• Identity service TODO
• File service TODO

Frontend services

• Crypto Storage Service TODO
• Contact Service TODO