Meeting #2 of the Frontend Team

Meeting #2

Details

📅 Date: 04.11.2022

📍 Location: Discord

🕐 Duration: 20.40 - 21.40

📝 Note Taker: Altay Acar

👥 Attendees:

• Altay Acar
• Gökay Yıldız
• Koray Tekin
• Muhammed Enes Sürmeli

Agenda

1. Opening an environment file and converting our RESTful API and any other API key that we will use into an environment variable
2. Change password page implementation
3. Sign in token
4. Determining a general layout of home page
5. Implementation of home page according to the general layout
6. Determining a general layout for the learning space detail page
7. Implementation of learning space page
8. Implementation of annotation

Discussion

1. We have decided to open an env file and keep every private variable such as our API keys, IP addresses etc. in there and use it through the development of whole web application.
2. We have decided to implement a change password page to be done with the every authentication related page. After verifying the email for forgot password, the user will change their password. Upon change, they will be redirected to the homepage. Also the change password page implementation will be further used in the profile settings part.
3. Further implementation of our web application needs a static navigation bar. This navigation bar will remain in every page that can be accessible from the home page after signing in. We have decided to have Home | Categories | Profile | About | Contact sections in the navigation bar. Since the navigation bar will be in the header of each page, search bar, notification icon, and the logo also needs to be implemented alongside.
4. We have determined the general look of the home page. Below are the components that the home page will have. Since the backend implementation of every component is not done yet, those components would not be functioning. They will be updated with the development of their respective endpoints.

• 1. Navigation bar
• 2. Search bar
• 3. Logo
• 4. Notification icon
• 5. My learning spaces
• 6. Popular learning spaces
• 7. Recommended learning spaces
• 8. Activity / feed
• 9. Create learning space button
• 10. Any needed filler illustration

5. Since our web application requires the users to sign in before using any feature of it, we need to keep the signed in user's data before redirecting them to any page after authentication related pages. Thus, we need to implement a token based method to keep the user's signed in data. Log in and email verification pages will be first pages to redirect to home page if signing in is successful. Thus, we need to consider them first. For that we considered using localStorage functionality. Also, any other page cannot be accessible without signing in. So, we need to show an error page for that occasion. This error page will also be used for accessing to any non-existing page of our web application. So, an if else block in App.js can be useful.
6. We have also discussed on the general look of a learning space page, which will be the next step of our frontend development. Below are the components we have decided to have on a learning space page. Since, learning space related implementation needs more discussion from the whole group and the customer at this moment, we have decided to hold for implementation for at least one week.

• 1. Header (same for every page)
• 2. Title of the learning space
• 3. Short description of the learning space
• 4. Save learning space button
• 5. Contributors -> Creator will be on top
• 6. Chapters
• 7. Notes section
• 8. Annotations section
• 9. Forum section
• 10. Reviews section

7. We have skimmed through some examples of annotation implementation and decided to conduct further research on how to implement annotations using React or is there any external libraries that we can use. So we will open a research issue concerning the whole frontend team.

Action Items

#	Details	Assignee(s)	Due	Issue
1	Open an env file and keep our private variables in there and adjust our code accordingly	Gökay Yıldız	07.11.2022 - 23.59	#link
2	Implement the change password page	Gökay Yıldız	07.11.2022 - 23.59	#link
3	Implement the static navigation bar and the header	Koray Tekin	07.11.2022 - 23.59	#533
4	Implement the home page	Altay Acar	07.11.2022 - 23.59	#519
5	Signed in user's data, session, and token-related implementations	Muhammed Enes Sürmeli	07.11.2022 - 23.59	#521
6	Implement the error page	Muhammed Enes Sürmeli	07.11.2022 - 23.59	#520
7	Research on annotation implementation issue	Koray Tekin	07.11.2022 - 23.59	#526