Updates on Dev.to clone in Angular - August 13
Tags: angular, showdev, webdev, typescript
Published: 2021-08-13 07:23:51

### Help me improve these updates by giving suggestions.

Github Repo - https://github.com/ajitsinghkaler/devto-clone

Deployed on Firebase - https://dev-toclone.firebaseapp.com/

Last week we added basic details page.

![August 6 updates](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h06mqz8sdn8v8r5ds8zj.png)

This week I added user details and a reaction section in article details. There is no API for adding reactions to actual dev.to site so the reactions component is read-only for now.

This week I have good news [Chellappan](https://twitter.com/che_off) did the listings page for us. I am really happy this is a first opensource contribution in my project. Thanks Chellapan
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/44ikd3wjc0tikkiyo8b4.png)

He implemented the masonry layout in this and next I'll write how he implemented the masonry layout. 

Now back to my work this time added a global component store for user details in the article-details component. I also had a lot of problems with the layout of the page the layout was not working correctly whatever I set in the grid-template-columns but after putting a lot of time in it I realized its just that article details content is not working correctly either the image was bigger then the body or the code-snippets were. I was really tired of this, to solved this problem my mind told so what is not styled the details content. This made me realize that the problem should be there. Then I checked and then there it was so for now I made images with width 100% and its working  fine for now. This is where we are now.
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c0vbcuzqvfaogz6ahbxq.png)![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4fnbtvzebu6vfa2feivw.png)
Next week I'll style article details and on the comments section.

## Issue 

* The article section is really getting on my nerves. Making so many stores for articles is annoying.

*  Moving it to Nx. I've heard a lot about Nx this will be my first Nx project.

## Commits done

[Branch](https://github.com/ajitsinghkaler/devto-clone/tree/article-detail)

1. [WIP: added listing pages and masonary layout](https://github.com/ajitsinghkaler/devto-clone/commit/ccdc0ba77432c7d711c184f3ebb79a25309ce6b9)

1. [wip: listings cleanup](https://github.com/ajitsinghkaler/devto-clone/commit/72660af32bf68b69e7d1eb3aca5d0568f97cd0b4)

1. [cleanup: review comment fix](https://github.com/ajitsinghkaler/devto-clone/commit/3a16db0b2c0b63a7b08b7117cb138ab03aa75159)

1. [cleanup: remove unused code](https://github.com/ajitsinghkaler/devto-clone/commit/a2e7357fc2a3e5df1db527f2ad552e8da51d3699)

1. [added sidenav nav functionality](https://github.com/ajitsinghkaler/devto-clone/commit/d1095f3b92ffc9107c5fcc69aba6b6fba1603377])

1. [article details page with sidenav](https://github.com/ajitsinghkaler/devto-clone/commit/983a4c1cd4e2a54dc272b54f392f4032639b5a5e)

1. [resolve splice bugs](https://github.com/ajitsinghkaler/devto-clone/commit/315c89bb2e13a6df7240574d7d42249cf633904a)


As you can see a lot of content was added. Now we will soon dive into improving it more using Nx and Tailwind once we finish the basic application.