Beginner’s guide to react/redux —painting a mental model

  • I highly recommend anyone starting out with Redux to read the core concepts outlined in the official documentation.Long story short, Redux application has a plain object, known as store, which serves as data model for your app.
  • For example, for a list of articles, I can have an article state that looks like this:state = { articles: [{ “id”: 314, “title”: “6 innovative apps utilizing the ethereum network”, “source”: “Investopedia‎”, “link”: “date”: “1500523200”, “type”: “msm” }, { “id”: 893, “title”: “what is plasma and how will it strengthen…”, “source”: “Investopedia‎”, “link”: “date”: “1502856000”, “type”: “msm” },.
  • In our article example, fetching articles is an action that looks that this:{ type: ‘ARTICLES_FETCHED’, payload: [{ “id”: 314, “title”: “6 innovative apps utilizing the ethereum network”, “source”: “Investopedia‎”, “link”: “date”: “1500523200”, “type”: “msm” }, { “id”: 893, “title”: “what is plasma and how will it strengthen…”, “source”: “Investopedia‎”, “link”: “date”: “1502856000”, “type”: “msm” },.
  • In our article example, the reducer looks like this:const initialState = { articlesById: null,}export default function(state = initialState, action) { switch (action.type) { case types.ARTICLES_FETCHED: return { …state, articlesById: action.articlesById } default: return initialState }}To summarize the basic ideas of Redux:it describes state as plain objects, and store (global state) by merging all the states in your app.it describes changes to the app as plain objects.it uses pure functions to handle changes.The redux API then bridges your redux logics with react views while providing some utilities to compose states.Say we send a request to a remote server and fetch some articles.
  • The reducer evaluates the action and store the payload articles in the state.

Disclaimer: This article is written by a beginner trying to comb through new concepts she just learned. React/Redux is the hottest frontend frameworks these day. If you google the term Redux diagram…
Continue reading “Beginner’s guide to react/redux —painting a mental model”

The Easiest Way to Learn React Native – Handlebar Labs – Medium

“The Easiest Way to Learn React Native” by @spencer_carli #javascript #react #reactnative

  • The Easiest Way to Learn React NativeI’ve spent a lot of time working with React Native.
  • I started using it very shortly after it was open sourced and have used it daily since that time — growing with the platform, experiencing different upgrading pains, transitioning between different navigators, and so on…I’ve also spent a lot of time putting together tutorials about React Native (40+ blog posts, 15+ videos) and talking to people getting started with it (hundreds of incredible emails).
  • There are a ton of great learning resources out there already but they can be scattered between dozens of blog posts, in a less than ideal format (some people like text, some like video, etc.), and some people just aren’t ready to invest hours upon hours researching yet.With all of this information I wanted to try my hand at putting together the easiest way to start learning React Native.
  • A time friendly, budget friendly, single source of information to get you that essential 20% of knowledge.That’s what Create Your First React Native App is.
  • Or think of it this way, if you value your time at $30 per hour and it saves you even an hour of your time, the course will have paid for itself.I’m excited to share this with you and I hope that it will make using React Native more accessible to more people!Sign Up for Create Your First React Native AppQuestions?

I’ve spent a lot of time working with React Native. I started using it very shortly after it was open sourced and have used it daily since that time — growing with the platform, experiencing…
Continue reading “The Easiest Way to Learn React Native – Handlebar Labs – Medium”