PART 1 - REACT NATIVE 🤵 & STYLED COMPONENTS 👰 — THE PERFECT MARRIAGE ❤

José Carlos
2 min readApr 30, 2021

Hello welcome,
This is my first publication and I could not begin with the best topic: STYLED COMPONENTS.

WHAT WE WILL DEVELOP?

BUT FIRST ! WHAT IS STYLED COMPONENTS ?

Through the Documentation what is said about the stylized components is this:

Utilising tagged template literals (a recent addition to JavaScript) and the power of CSS, styled-components allows you to write actual CSS code to style your components. It also removes the mapping between components and styles — using components as a low-level styling construct could not be easier!

IT’S VERY CONFUSED RIGHT?

I believe that the best way to learn is to put into practice , so let´s go !!!!

PART 1 — START THE PROJECT

We will use Expo Bare Workflow because they will have full control over all aspects of the native project and we will have access to some EXPO tools.

All my recent react-native projects have this configuration

npx expo-cli init styledComponentsTest

Now chosse minimal (TypeScript) option

Open the created Folder in VSCODE

That must be what you must have

Now open your terminar (CTRL + J) and type :

yarn add styled-components @types/styled-components-react-native

Second Part leaves tomorrow

--

--