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)
Very nice 4 unique components, with functions connecting them!
If you wanted to expand on this adding an "are you sure?" modal popup on delete might be a nice touch!
Great idea! Thanks :D
Nice UI! Testing your app i found two things:
Responsiveness. Can't believe I forgot about that 😅
Thanks for pointing it out!
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
Thanks!
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.
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!
Got repo?
Here's the repo: github.com/BraydenTW/simple-react-crm
Any particular reason why are you not using arrow functions?
Not sure, I was just using the
rfceVScode snippet and it generates one without arrow functions. Do you know of a shortcut that generates a stateless functional component with an arrow function?I wish. I type them manually. Installed bazillion extensions just to see nije of them work 😂
Okay no problem then. I can handle it 😅
Not yet, I'll let you know when I do :)
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.This was just a way of me practicing my skills from the past 24 hours. I'm planning to learn Redux and Styled Components.
Nice UI
Thanks :-)
Cool nice start.
Welcome to the wonderful world of React! Great start!
Thank you Justin!
Looks neat, keep making progress
Thanks Vishnu!
It's beautiful!
Thank you so much!
I'd be happy to check out your repo! React is a great library to learn in this current climate. Good luck on your adventure Brayden!
The repo link is here: github.com/BraydenTW/simple-react-crm
Thanks! Be sure to update your Readme.md to personalize it with the project goals, tools used, and a brief author bio!
Good idea! I’ll be sure to do that :D
Nice work bro. For the security, you should put a required in JS and HTML because if I inspect the element and I delete required I can still submit it
Mickael, I am just curious about how to do that. I am also a beginner in Web development.
Hi Sridhar, I'm a php developer, I don't know React sorry
Thanks. I'll work on that :)
Congrats, man! it looks really nice on mobile! Good luck on learning React :D
Thanks so much!
That's a pretty neat UI ❤❤❤
I've been trying to make one as well once It's done I'll share here.
Try using the useRef hook and try implementing localStorage 👍
Cool! I'll check those out for the next time :D