create account

ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile by eastmael

View this thread on: hive.blogpeakd.comecency.com
· @eastmael ·
$46.08
ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile
![image.png](https://ipfs.busy.org/ipfs/QmbwrFgKgFrJustQZxLQjPLkT2gDYusnLHvMB8Brdr9EFE)

This is my second contribution to Utopian V2. Although it took more time than I expected, my PR was finally merged and closed.

### Repository
https://github.com/utopian-io/v2.utopian.io

#### Task Request
https://steemit.com/utopian-io/@gregory.latinier/utopian-v2-task-profile-module-work-experiences

#### Pull Request

https://github.com/utopian-io/v2.utopian.io/pull/218

#### Feature

![work-experience-demo.gif](https://ipfs.busy.org/ipfs/QmX7tiVHaq2C4RM5Lr9ApcWKcaiJHd7TQjHd9GdZogCm3t)

There are two parts to this post. First is a run-through of my [commits history](https://github.com/utopian-io/v2.utopian.io/pull/218/commits) and the second is some technical explanation of the codes.

#### Commits History

> There's a story behind every code.

The major parts in my [commits history](https://github.com/utopian-io/v2.utopian.io/pull/218/commits) were:

* [1794f2f](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/1794f2fcd2b34f3603c83e59e44c758d59ebcdda) - provided the skeleton - the layout - where I did my changes.
* [101a243](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/101a243ea110c2accd75717c7ad68224ad50038f) - added the work experience fields to the user model (to persist the user information).
* [e3e52e7](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/e3e52e770c342d7baefebc7f82ad96ff6dcebf29) - updated the work experience layout
* [e97b2d5](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/e97b2d573d6bf0fa8387e182d485b8264fdfdd58) - added the work experience API end points
* [db1fb3c](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/db1fb3c20a768885a00a24c8d441276479cd4122) - code refactor
* [8cb2742](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/8cb27427f698ef9435500e4142514fb31598dbc7) - added delete experience function
* [f98fcb3](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/f98fcb3a773a6904ada61cd2c510a30b97d20220) - exported strings to i18n
* [4362837](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/4362837044778bb0254d50f922636177346c1a88) - added validations
* [f811680](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/f81168081c642c25fd8b95131e708a8531b08249) - added unit tests
* [8df58af](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/8df58af2e33ad81fede2107ad50105a1fec56bbd) - sort experiences from most recent to oldest

#### Code Changes

https://github.com/utopian-io/v2.utopian.io/pull/218/files

##### 1. API

###### 1a. Main Codes

* [`packages/api/modules/users/handlers.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-d6583c66110f65c2d8b692c224edbd6f) - these were the API endpoints - the methods that directly interacted with the database
* [`/packages/api/modules/users/routes.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-296ff5718c5428b25ef5fbf77616dacc) - the routes that maps the above functions to URLs
* [`/packages/api/modules/users/user.model.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-8cfc9557e458a102c58649686a2b0021) - the user model; change in the user model class to include work experiences information (called subdocument in mongo)
* [`/packages/api/modules/users/validate.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-cc394e8abc54ccb6d71e7173d3a122ad) - as what can be inferred from the name, model validation

###### 1b. Unit Tests

* [`/packages/api/test/fixtures/users.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-78a082d9fdb3e66d3acd3adf318b0789) - test data
* [`/packages/api/test/modules/users/users.handlers.spec.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-ee6149cc2f02eb780239edf3de3b3a56) - the specs that test the newly added API end points

##### 2. Client

* [`/packages/client/src/pages/users/profile/profile.vue`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-ce5c3585f3376714a1812bc0c8ff7a7c) - the main profile page; the major component where the important codes were included
* [`/packages/client/src/store/users/actions.js`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-77c4b16544cd36d583b4d2a2b5088517) - the user actions that dispatches or calls the necessary API end points to process user information

##### 3. Internationalization

* [`/packages/i18n/locales_master/en.json`](https://github.com/utopian-io/v2.utopian.io/pull/218/files#diff-0d6c63c97dfee46e060dd990ad73488f) - exported strings for internationalization

#### Lessons Learned

I encountered a lot of challenges in completing this task. First, was my unfamiliarity with mongo API. Although I had an idea in mind of what I wanted to happen, my unfamiliarity with mongoose resulted in code smell. Gregory cleaned that up for me by what he did in his last commit:

* [a9c1067](https://github.com/utopian-io/v2.utopian.io/pull/218/commits/a9c1067c72b5a87fb17f5c994e251bc5e63c39af)

He removed the `getWorkExperience` API end point and just returned the whole work experiences document to `updateWorkExperience`'s response. The key mongoose method here was `findOneAndUpdate`.

The second challenge was my unfamiliarity with flex-box. Gregory just pointed me to use that to adjust the location of the plus icon.

And lastly was my unfamiliarity with [vuelidate](https://monterail.github.io/vuelidate/), this resulted again in code smell and I learned again from the codes committed by Gregory. 

There were other changes made by Gregory in that commit. All of them were learnings for me.<br/><div class="pull-right promo"><sub><p>This post was made from https://ulogs.org</p></sub></div>
πŸ‘  , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , and 480 others
properties (23)
authoreastmael
permlinkulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile
categoryulog
json_metadata{"community":"ulogs","app":"ulogs/1.0.0","format":"markdown","tags":["ulog","utopian-io","development","ulog-utopian","steemdev"],"users":["gregory.latinier"],"links":["https://github.com/utopian-io/v2.utopian.io","https://steemit.com/utopian-io/@gregory.latinier/utopian-v2-task-profile-module-work-experiences","https://github.com/utopian-io/v2.utopian.io/pull/218","https://github.com/utopian-io/v2.utopian.io/pull/218/commits","https://github.com/utopian-io/v2.utopian.io/pull/218/commits","https://github.com/utopian-io/v2.utopian.io/pull/218/commits/1794f2fcd2b34f3603c83e59e44c758d59ebcdda","https://github.com/utopian-io/v2.utopian.io/pull/218/commits/101a243ea110c2accd75717c7ad68224ad50038f","https://github.com/utopian-io/v2.utopian.io/pull/218/commits/e3e52e770c342d7baefebc7f82ad96ff6dcebf29","https://github.com/utopian-io/v2.utopian.io/pull/218/commits/e97b2d573d6bf0fa8387e182d485b8264fdfdd58","https://github.com/utopian-io/v2.utopian.io/pull/218/commits/db1fb3c20a768885a00a24c8d441276479cd4122"],"image":["https://ipfs.busy.org/ipfs/QmbwrFgKgFrJustQZxLQjPLkT2gDYusnLHvMB8Brdr9EFE","https://ipfs.busy.org/ipfs/QmX7tiVHaq2C4RM5Lr9ApcWKcaiJHd7TQjHd9GdZogCm3t"]}
created2019-01-13 09:12:09
last_update2019-01-13 09:12:09
depth0
children8
last_payout2019-01-20 09:12:09
cashout_time1969-12-31 23:59:59
total_payout_value34.841 HBD
curator_payout_value11.238 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length5,752
author_reputation78,967,407,130,763
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,308,866
net_rshares85,600,597,948,599
author_curate_reward""
vote details (544)
@blazing ·
Great to see you after a very long time :)
πŸ‘  
properties (23)
authorblazing
permlinkre-eastmael-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190113t131034223z
categoryulog
json_metadata{"tags":["ulog"],"app":"steemit/0.1"}
created2019-01-13 13:10:36
last_update2019-01-13 13:10:36
depth1
children1
last_payout2019-01-20 13:10:36
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length42
author_reputation117,662,220,860,076
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,315,607
net_rshares17,545,763,511
author_curate_reward""
vote details (1)
@eastmael ·
Thank you. Yup, not that actively posting but just developing.
properties (22)
authoreastmael
permlinkre-blazing-re-eastmael-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190113t132527810z
categoryulog
json_metadata{"tags":["ulog"],"app":"steemit/0.1"}
created2019-01-13 13:25:21
last_update2019-01-13 13:25:21
depth2
children0
last_payout2019-01-20 13:25:21
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length62
author_reputation78,967,407,130,763
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,316,118
net_rshares0
@helo ·
$12.25
- Great job on sharing your lessons learned, everyone can benefit.
- I see that Gregory gave you some great review comments already within your PR.
- I'm a bit surprised that there is no comments in the code apart from the function headers.

Your contribution has been evaluated according to [Utopian policies and guidelines](https://join.utopian.io/guidelines), as well as a predefined set of questions pertaining to the category.

To view those questions and the relevant answers related to your post, [click here](https://review.utopian.io/result/3/2-2-1-1-1-1-3-).

---- 
Need help? Write a ticket on https://support.utopian.io/. 
Chat with us on [Discord](https://discord.gg/uTyJkNm). 
[[utopian-moderator]](https://join.utopian.io/)
πŸ‘  , , , , , , , , , , , , , , , , , , ,
properties (23)
authorhelo
permlinkre-eastmael-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190114t220533535z
categoryulog
json_metadata{"tags":["ulog"],"links":["https://join.utopian.io/guidelines","https://review.utopian.io/result/3/2-2-1-1-1-1-3-","https://support.utopian.io/","https://discord.gg/uTyJkNm","https://join.utopian.io/"],"app":"steemit/0.1"}
created2019-01-14 22:05:33
last_update2019-01-14 22:05:33
depth1
children2
last_payout2019-01-21 22:05:33
cashout_time1969-12-31 23:59:59
total_payout_value9.263 HBD
curator_payout_value2.982 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length738
author_reputation121,547,934,535,311
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,381,233
net_rshares20,927,591,279,275
author_curate_reward""
vote details (20)
@eastmael ·
Thanks for the review. I forgot to write inline comments. Lol
properties (22)
authoreastmael
permlinkre-helo-re-eastmael-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190114t231315488z
categoryulog
json_metadata{"tags":["ulog"],"app":"steemit/0.1"}
created2019-01-14 23:13:21
last_update2019-01-14 23:13:21
depth2
children0
last_payout2019-01-21 23:13:21
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length61
author_reputation78,967,407,130,763
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,383,334
net_rshares0
@utopian-io ·
Thank you for your review, @helo! Keep up the good work!
properties (22)
authorutopian-io
permlinkre-re-eastmael-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190114t220533535z-20190117t120636z
categoryulog
json_metadata"{"app": "beem/0.20.9"}"
created2019-01-17 12:06:36
last_update2019-01-17 12:06:36
depth2
children0
last_payout2019-01-24 12:06:36
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length56
author_reputation152,955,367,999,756
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,497,092
net_rshares0
@steem-ua ·
#### Hi @eastmael!

Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your post is eligible for our upvote, thanks to our collaboration with @utopian-io!
**Feel free to join our [@steem-ua Discord server](https://discord.gg/KpBNYGz)**
properties (22)
authorsteem-ua
permlinkre-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190114t221726z
categoryulog
json_metadata"{"app": "beem/0.20.14"}"
created2019-01-14 22:17:27
last_update2019-01-14 22:17:27
depth1
children0
last_payout2019-01-21 22:17:27
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length287
author_reputation23,214,230,978,060
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,381,638
net_rshares0
@utopian-io ·
Hey, @eastmael!

**Thanks for contributing on Utopian**.
We’re already looking forward to your next contribution!

**Get higher incentives and support Utopian.io!**
 Simply set @utopian.pay as a 5% (or higher) payout beneficiary on your contribution post (via [SteemPlus](https://chrome.google.com/webstore/detail/steemplus/mjbkjgcplmaneajhcbegoffkedeankaj?hl=en) or [Steeditor](https://steeditor.app)).

**Want to chat? Join us on Discord https://discord.gg/h52nFrV.**

<a href='https://steemconnect.com/sign/account-witness-vote?witness=utopian-io&approve=1'>Vote for Utopian Witness!</a>
πŸ‘  
properties (23)
authorutopian-io
permlinkre-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-20190115t144347z
categoryulog
json_metadata"{"app": "beem/0.20.9"}"
created2019-01-15 14:43:48
last_update2019-01-15 14:43:48
depth1
children0
last_payout2019-01-22 14:43:48
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length590
author_reputation152,955,367,999,756
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,412,165
net_rshares17,856,155,433
author_curate_reward""
vote details (1)
@verifyme ·
@eastmael You have received a 100% upvote from @steemconductor because this post did not use any bidbots and you have not used bidbots in the last 30 days!

Upvoting this comment will help keep this service running.
πŸ‘  
properties (23)
authorverifyme
permlinkre-ulog-15-utopian-v2-contribution-adding-work-experience-to-user-profile-eastmael-verifyme-randomvote
categoryulog
json_metadata{"tags":["verifyme","random-upvote"],"users":["eastmael","steemconductor"],"app":"null/null","format":"markdown"}
created2019-01-14 09:13:27
last_update2019-01-14 09:13:27
depth1
children0
last_payout2019-01-21 09:13:27
cashout_time1969-12-31 23:59:59
total_payout_value0.000 HBD
curator_payout_value0.000 HBD
pending_payout_value0.000 HBD
promoted0.000 HBD
body_length217
author_reputation-705,247,747,464
root_title"ULOG #15: Utopian V2 Contribution - Adding Work Experience to User Profile"
beneficiaries[]
max_accepted_payout1,000,000.000 HBD
percent_hbd10,000
post_id78,354,804
net_rshares17,970,579,364
author_curate_reward""
vote details (1)