Blog Posts on react

Here's a list of all my blog posts with the react tag

Design Tokens and Theming
As frontend developers we are normally given a design from Figma or similar tools that we then need to turn into code. So where do we start? What are the first steps we should take when converting our design into code?
- react
Theming in React
Theming is a fascinating topic and a really important one these days as more and more people add light and dark mode to their sites and companies change the theme of their site or part of their site on specific dates to celebrate occasions such as christmas, pride week etc.
- react
Building a Cart Context Component
Creating a generic cart component that can add and remove a product from the cart using React Context. This component can then be used in any other component or app to create more specific cart components.
- react
Building and Testing a Counter Component
We want to build and test a counter component built with React and TypeScript. So where do we start? Which components do we need to build to create this component and what do we test?
- react
- testing
TypeScript and Children
What happens when we pass in children in React? Children is a special prop that allows us to pass in any type of element. It could be a number, a string, a boolean, an array of elements or even another component. So how can we check the types?
- typescript
- react
Building and Testing a Select Component
Building a Select component with a Composition to see the component render in isolation as well as Tests using React Testing Library to test the select works on change and shows a new value.
- react
- testing
Testing a Button Component
Testing a button component with React Testing Library. What to test and how to test your button component when building multiple compositions of the button.
- react
- testing
Adding TailwindCSS to Bit
Adding TailwindCSS to your Bit components by adding it to the env that is used by your components. This way the the component compositions will show the TailwindCSS classes.
- react
Building an ecommerce Product details component
Where do you start when building a product page for an e-commerce store? How do you think about naming the components and how much to break down the components? What do you start building first and why?
- react
Understanding TypeScript
TypeScript is a superset of JavaScript. Any types that are added are not part of the final bundle so really TypeScript is there to make your life easier as a developer.
- typescript
- react
Sharing React Components across Multiple Applications
We have almost all been in a situation where we need to share a component between one app and another. Often we just decide to copy and paste it because it really is the quickest option. And sometimes it’s even ok, especially when it comes to those smaller components. But what if you wanted to share a big and more complex component?
- react
- architecture
Learning React
Recently I started learning React for my new job. I basically went from being a coding ninja to being a coding newbie. But hey everything can be learnt so here is what I have learnt so far.
- react