Styled-components allows us to create a normal React component that has styles bound to it. There are many benefits to implementing styled-components in your React app:
While converting a recent React application’s class components to functional components with hooks, I began searching for a way I could use hooks to not only manage local state but also allow my components to access global state from my Redux store.
I found that React Redux version 7.1, which was released in 2019, includes two new hooks
useSelectorwhich allow us to ditch the higher-order
connect component and instead, connect our components to the Redux store using hooks.
useDispatch hook returns a reference to our
dispatch functions from the Redux store. We can use it to…
Learning the best ways to use CSS can sometimes feel like this:
To avoid ^^ I want to share a simple, elegant way to create CSS animations using
keyframes. When you think about it, animating an element is in fact just changing the style or look of that element from one period of time to another. That style could be anything. It could be that element’s position on the page, its color, its shape, its size. You name it, you can animate it.
@keyframes give us is a set of rules and points in time at which to…
As defined by MDN documentation:
But what does that mean exactly?
A few months ago, during the assessment of my Rails project at the Flatiron School the teacher asked me to implement a simple search feature in my project that would allow a user to search for all items within a particular search criteria.
What happened next was a mad dash of documentation searching to figure out how to implement such a feature in my project. I’m writing this in hopes of helping future Rails newbies who want to add search functionality into an application.
My search bar was designed so that a user could search for all properties within…
React is great for many things; it’s pretty easy to learn and use, it allows developers to create replicable components and templates for a site, and it makes use of a virtual DOM to know which parts of the actual DOM to re-render thus boosting site performance.
One thing React isn’t great at is handling forms. If you’ve searched the web for ways to handle form validations in React before, you know what I’m talking about. One way to handle form validation in React is to set up an
errorMessage key in a component’s state and set up some conditional…
Last month I created a yelp-style application using React/Redux with a Rails API backend. I wanted to continue refining my React knowledge and decided that adding an autocomplete search bar would be a really helpful element, since searching for a type of business is the first thing someone does to interact with this application.
Since my application uses Redux, I didn’t need to include a
axios call in my search component. I simply had to…
Last summer I took a big risk and decided to dive into a full-time software engineering program at the Flatiron School. I had been interested in web development for a while but had very little experience with actual coding. I had saved up enough money to be able to leave my yoga teaching and non-profit jobs behind to embark fully on this five-month journey.
Five months later, I can whole-heartedly say that it was one of the best decisions I’ve ever made. It was incredibly challenging and I was forced to push myself harder than I ever have, but with…
For my final project at the Flatiron School, I wanted to create a yelp-like app that would celebrate small businesses and the rich diversity of local shops in Los Angeles. My yelp-clone would allow a user to filter the businesses searched for by the communities one wanted to support so a person could search through BIPOC-owned businesses, LGBTQ+-owned businesses, Women/Womxn-owned businesses, and/or businesses that have a documented track record of having a social impact commitment.
This project presented me with a number of logistical challenges, some of which I’m still working through (if anyone reads this and can help me…
I felt really confident in my rails knowledge and decided early on that I wanted to have four models in my project. I began to create my Trip Planner rails backend using the following models: Trip, Category, Item, and Trip Category. The last model was necessary to create a…
Full Stack Software Engineer passionate about coding, intersectional environmentalism, and pho.