Building my Portfolio Site with React and Styled Components

 It's been a long and occasionally tedious journey to get to here.  For my final Flatiron project I built a personal portfolio site to begin to build my online presence as a web developer.  This app I utilizes react for the frontend and makes heavy use of stylized components to reduce the need to reuse code as the site eventually grows with future projects.  

 The backend on this project is built using a ruby on rails API.  The API is connected to the contact form page from the client using redux and all sent posts can be easily checked from the admin page.


One of the most useful pieces of  tech I learned to appreciate during this project is styled-components.  This allows you to name your components and use css on them in a way that is cleaner and more familiar to me than inline styling in the component itself.   Below is an example of a styled component. 

 Please note, I have found that this way of structuring container components in an folder with the components name and making two auxiliary files: an  "index.js" file to contain the component structure and an "elements.js" file to hold all of the stylistic

 

    elements.js 

**note:: this is done using 'styled-components' and this must be installed through npm and imported in the elements.js file before this works


     

 

    index.js



Comments