gbowne1 / codebooker

This is a book recommendation app created with React 18.2 and MUI for coders/programmers looking for reccomendations to books on programming/coding to read

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

[FEAT] Add a Create Profile feature

gbowne1 opened this issue · comments

The app currently does not have a method for the user to create their user profile after having signed up or registered and logged in or signed in.

Create a means for the user to create their profile once they have done that.

This may include some backend tasks. We can make a separate issue for that.

@ratishjain12 this is the issue for a create profile feature for after the user has registered and has logged in successfully. It's a separate issue from the user profile issue which is the displayed profile when the user might click on "Profile" somewhere in the UI, perhaps the dropdown on the (R) user icon. Let me know if you want assign this issue. This would be for the form. The other issue is for the actual user profile

I have created a link to profile page on dropdown and created a mock profile page just to display logged in user details

@gbowne1 should I ask user to give details after registeration process?

can you give me just prompts on what should I ask user in the present form for now

Once its done I'll fetch user information and display on the profile page if that works with you

Yes, the "Create User Profile" workflow would be a form, which would come after registration. So, ideally we should pass in a new route /profile/create/:id or /create-profile or something like that.

It would be a form, so you could use Formik for the forms and Yup for validating the form data. Both work nicely with Material UI/MUI v5.

This form data would be saved at the end of the process to the database, and the data would appear in the /profile route that already exists which is accessible by clicking on the Profile button in the user icon menu (R).

This form would ask for:

Name
Alias
Location (This will need some internationalization)
Education/Learning/School (what schools they are going to or went to)
Occupation/Job/Work/Career (whatever job the person has or work the person does)
Programming Skills: Frontend, Backend, Game Development, Languages (dropdown select), Devops, etc.
Favorite Editor/IDE: VSCode, Visual Studio, Sublime Text, Vim, Geany, Kate, JetBrains, NeoVim (dropdown select)
Operating System: Mac, Linux, Windows (version), Unix, BSD
Provide a means for the user to add/edit/upload their pic or avatar

We could eventually provide the user a means of creating profile backgrounds, images, etc.

@BlackBond06 @LOGESH-B

Hii @ratishjain12 @gbowne1

What if the user cancel the tab during the profile creation? We need to handle this🤷‍♂️

I would prefer all users have a profile of some sort, especially if it will be shareable with other users of the app. We will also handle the spam users (not real users, bots, nefarious/bad-actor users, etc).

I mean technically we could let the user cancel and do their profile later, but I don't believe that's a great user experience.

We need to implelment using the randomuser.me API to bring in some test user data, it will populate the users profile pic/avatar for us. I made an issue for that, it is #101. From there a user could potentially change their photo.

Hi @gbowne1, could you please clarify what you mean by this form property: Location (This will need some internationalization)

@BlackBond06

I have assumed that this app will be used outside the USA, so the location format could change depending on the country.

The format for the location field in both the form and the displayed profile page will need to change state depending upon whether the user is in the USA or not.

In the USA, Locations usually follow this format:

City or Town, County, State. An example of this might be anytown, anycounty, state. State is usually a 2 letter abbreviation.

Outside the USA the format will be different. That's what I meant for internationalization.

Using the randomuser.me API might help out with completing this task as the API includes a lot of data we could extract to the a sample profile the user could edit. Just a thought. Theres a issue for that I made here: #101

@gbowne1 @LOGESH-B I have made pull request for this feature

@BlackBond06 do you have any screenshots for the new feature(s) you added?