Card Business Component with React
This is my first project with React. It is a static website.
The purpose of this project is to practice React. Learn the very basics of React.
You can give feedback on GitHub by creating an issue.
- HTML Semantic Tags
- BEM (Block, Element, Modifier)
- CSS Flexbox
- Mobile-first workflow
What I learned
I learn a little bit of this. I never get a chance to use them in my projects. So, this is the first time I am using the
In React it is common thing to use those keywords such as importing components, SVGs, and stylesheets.
I don’t take a deep dive into learning
import. So, I can’t share a lot of things about this.
In the future, I need to understand this.
Create React components
I learn to separate HTML markup into components.
When creating components, I find it overkill for this size of the project. So, I would prefer to have a single card component. Even better, I would use HTML and CSS to create this. It is just a static website so I don’t need to use React.
Anyway, the purpose of this project is to learn React. So, it’s okay.
For example, I create a
Button component which is a link that gets styled like a button. Here is the code snippet.
Then to use it, I need to at least do the following in the
The HTML markup that gets generated is the following:
I am not comfortable doing this. I have a lot of questions, like:
- Is it correct to do this?
- What is the best practice?
- Is there a better way to do this?
But, I hope I can understand React better in the future.
- React Docs Beta – This helped me to learn the basic of React. By the time I am writing this the updated documentation is on beta version.
- Create React App – This helped me to understand the folder structure of the