urveryspecial / user-profile Goto Github PK

• add back to top page link at edit page
• Commonize appearance( buttons)
• favicon
• read me
• make demo page

• Image (fetch from gravatar)
• name
• email
• change password button
• edit button and change router

• setup google font
• font awesome icon
• add css framework
• setup vuex and add some dummy users
• display dummy users to top page(list)

• show change password modal
• add input field with validation
• an option to unmask
• display password strength
• change password from vuex

Requirement

Page specs

• Account page with these fields
  • Profile picture
  • Full name
  • Email
  • Change Password Button
  • Edit Button

Buttons

• When Edit button is clicked
  • name and email fields will be changed to input fields.
  • Editing full name should display a first and last name field.
  • all fields have validation.
• When Change Password is clicked
  • change route to change password page
  • password input field will be displayed.
  • Password form should have an option to unmask (no confirm password field)
    and should display a strength meter.

ETC

• Font-awesome for icons
• Open Sans (Google font) should
• Source should be documented and versioned.
• Picture should be fetched from Gravatar using user the email, and should use a default image

Additional Specs

• I think It's better that creating list page and new user page. Because
  • It's more natural.
  • Only a few time will be taken to make that.

Pages

1. Profiel List
2. Profile Details
3. Edit/New Profile
4. Change Password

Design

• https://ninjamock.com/s/ZNKSZTx

• first name input field
• last name input field
• email input field
• validation
• save vuex action

• add users dummy data to vuex
• add action to vuex for getting user data (async)
• add loading spinner
• create table and display users
• add router button to users list

as another task

• user delete
• user create button