DEV Community

Brayden W ⚡️
Brayden W ⚡️

Posted on

I'm a noob at ReactJS and made this 😅

Hi everyone!

A couple days ago I made a post saying that I was dropping my side-project. I wanted to open more paths for the future. One of the goals I wanted to accomplish was to learn ReactJS.

Over the past 24 hours, I've spent some time learning the fundamentals of React and made my first project using it.

It is a simple CRM (Customer Relationship Manager). In this, I displayed my knowledge of components, props, state management, and styling.

View it here: 👉 https://react-crmtool.netlify.app/

Github Repository: https://github.com/BraydenTW/simple-react-crm

Any feedback or ideas for what I should try next would be awesome.

Thanks again!


This post was orignally from me on Indiehackers. Check it out here: https://www.indiehackers.com/post/after-learning-react-for-the-past-24-hours-i-made-a-simple-crm-tool-02d26f1ef9

Top comments (57)

Collapse
 
link2twenty profile image
Andrew Bone

Very nice 4 unique components, with functions connecting them!

celebrate

If you wanted to expand on this adding an "are you sure?" modal popup on delete might be a nice touch!

Collapse
 
braydentw profile image
Brayden W ⚡️

Great idea! Thanks :D

Collapse
 
gbrantunes profile image
Gabriel Antunes

Nice UI! Testing your app i found two things:

  1. the customer panel can't handle long names
  2. I was able to add a empty customer name by adding an space

UI test

Collapse
 
braydentw profile image
Brayden W ⚡️

Responsiveness. Can't believe I forgot about that 😅

Thanks for pointing it out!

Collapse
 
valentinbcn profile image
Valentin

Looks really neat and clear ! congrats :D

It feels like it's mobile oriented so maybe you could try to make it more 'dektop oriented' aka fullscreen (media-queries and so ?) , hmmm and maybe you could look into animations too (?)

Have a nice journey by learning React ! :D

Collapse
 
braydentw profile image
Brayden W ⚡️

Thanks!

Collapse
 
vberen profile image
Nicklas Wessel • Edited

Looks great :)
Is there any reason you don't use functional components instead?

My suggestion would be to focus on that -
Personally when I made the switch from class components to functional components, was such a huge difference for me. I suddenly felt productive writing components.

States and lifecycle methods suddenly became very easy to master and very fast to write.

The same component can suddenly be halv the amounts of code line.

Collapse
 
braydentw profile image
Brayden W ⚡️

Thanks!

Simply for what I’ve mainly learned has been class components. I’ll try using functional components mainly in my next project.

Thanks for the suggestion!

Collapse
 
daxdax89 profile image
DaX

Got repo?

Collapse
 
braydentw profile image
Brayden W ⚡️
Collapse
 
daxdax89 profile image
DaX

Any particular reason why are you not using arrow functions?

Thread Thread
 
braydentw profile image
Brayden W ⚡️

Not sure, I was just using the rfce VScode snippet and it generates one without arrow functions. Do you know of a shortcut that generates a stateless functional component with an arrow function?

Thread Thread
 
daxdax89 profile image
DaX

I wish. I type them manually. Installed bazillion extensions just to see nije of them work 😂

Thread Thread
 
braydentw profile image
Brayden W ⚡️

Okay no problem then. I can handle it 😅

Collapse
 
braydentw profile image
Brayden W ⚡️

Not yet, I'll let you know when I do :)

Collapse
 
louislow profile image
Louis Low • Edited

Looking good... Since you have started this, should you continue to work on the noob project into a pro full-fledged CRM? Just give yourself a few months. If you don't like it, you can always do $ rm -rfv * and see them gone.

Collapse
 
braydentw profile image
Brayden W ⚡️ • Edited

This was just a way of me practicing my skills from the past 24 hours. I'm planning to learn Redux and Styled Components.

Collapse
 
arunmurugan78 profile image
Arun Murugan

Nice UI

Collapse
 
braydentw profile image
Brayden W ⚡️

Thanks :-)

Collapse
 
andrewbaisden profile image
Andrew Baisden

Cool nice start.

Collapse
 
polluterofminds profile image
Justin Hunter

Welcome to the wonderful world of React! Great start!

Collapse
 
braydentw profile image
Brayden W ⚡️

Thank you Justin!

Collapse
 
vic0de profile image
Vishnu Dileesh

Looks neat, keep making progress

Collapse
 
braydentw profile image
Brayden W ⚡️

Thanks Vishnu!