Build Dev.to Clone in ReactJS

Hey guys,

Today, I'm feeling so grateful for this DEV community. From the last few months this community gave me lot's of support. So in return I wanted to share something.

I have build this clone of this Dev.to. (Home page only)

Demo Link: https://devto-clone.vercel.app/

This clone has lot's of good features like in the dev,
Such as,

• Infinite Loading
• Skeleton UI etc.. It is mobile responsive.

Things that I have used to build this clone,
-- ReactJS (React hooks)
-- react-icons package
-- Sass for styling

I have also created tutorial, You can find it here:

Follow whole tutorial and you can learn lot's of things like,

-- Setting Layout
-- Creating Hamburger Menu
-- Getting data from API
-- Creating Skeleton UI
-- Infinite Loading
-- Mobile Responsive
-- React Hooks
-- Sass styling
-- Advanced Conditional Rendering etc.

You can find Full-Code from here.

Please share your valuable review!

All suggestions are welcome!

Thanks For Reading and Supporting.😄

Feel free to visit my youtube channel:

@CodeBucks

Follow me on Twitter where I'm sharing lot's of useful resources!

@code.bucks 😉

Note: This clone is for educational purpose only.

You might also like these website templates:

• A beautiful portfolio template in ReactJS => here
• NFT collection landing page in ReactJS => here

Comments

[Gustavo Scarpim]

Nice work, is cool!!
One problem, your dropdown-menu It is misaligned:

Besides, it's perfect!! Congrats!!

[CodeBucks]

Hey. Thanks for pointing that out! I will fix it. ^_^

[Ashish R Bhandari]

Hii,
The site looks awesome,
Great Job,
A small changes from my end.
A small Minimal CSS changes will make the things look good.

margin: 0 auto; // This will make your container be in center

.headerContainer {
    margin: 0 auto; 
    max-width: 1280px;
}
.main-container {
    margin: 0 auto;
    max-width: 1280px;
    padding: 1rem 0rem;
}

Adding this both in proper order or adding it in Inline Styling will help u achieve the below results.

[CodeBucks]

Hey, Thanks for the suggestions! ^_^

[Ben Halpern]

This is cool!

[Jaagrav]

Do you have any plans to refractor dev.to's code to react?

[Diego García (chory)]

Wow ! Very good work, thanks for sharing

[CodeBucks]

You're welcome! 😇

[Andrew Baisden]

Like it!

[Kwizera123]

Nice work ✔️

[Rexy Andriansyah]

Great work

[CodeBucks]

Thanks! ^_^

[Bert Meeuws]

Looks good! I was going to make a clone with a redesign too; what's next? Connecting a server with auth/db?

[CodeBucks]

Hey Thanks! Right now I haven't thought about connect it with any backend. If you want then you can try it. 😉

[Stokry]

Nice work!

[Angga Lesmana]

Wow thanks Sir . This good reference

[CodeBucks]

You're welcome! 😇