Topics Search

React

Home » React (60)
  • Page 1 of 3
  • »
 

Build A Media Library With React, Redux, and Redux-saga – Part 2

Build A Media Library With React, Redux, and Redux-saga – Part 2 Icon
In part 2 of this tutorial, which is unarguably the most interesting part of building React/Redux application, we will setup application state management with redux, connect our React components to the store, and then deploy to Heroku. We will walk through this part in eight steps:
 
Advertisement:
 

Common React Native App Layouts: Login Page

Common React Native App Layouts: Login Page Icon
In this series, you'll learn how to use React Native to create page layouts commonly used in mobile apps. The layouts you'll be creating won't be functional—instead, the main focus of this series is to get your hands dirty in laying out content in your React Native apps. If you're new to laying out React Native apps or styling in general, check out my previous tutorial:
 

How to Handle Routing in React

How to Handle Routing in React Icon
In this tutorial, we'll see how to get started with setting up and creating a React app. We'll focus on how to handle routing in a React app using react-router. Let's start by initiating our project using Node Package Manager (npm).
 

Getting Started With React and JSX

Getting Started With React and JSX Icon
In this tutorial, we'll have a look at how to get started with creating a React app and try to understand the basics of JSX. The tutorial assumes that you have a good understanding of HTML and JavaScript.
 

Get Started With React Native Layouts

Get Started With React Native Layouts Icon
In this tutorial, you'll learn how to lay out React Native apps and how to implement layouts commonly used in apps. This includes the Stack Layout, Grid Layout, and Absolute Layout. I'll be assuming that you already know the basics of styling a React Native app and how to use CSS in general, so I won't dwell too much on StyleSheet.create and how to add styling to different elements.
 

Redux without React — State Management

Redux without React — State Management Icon
Recently, I had one of those moments again and started working on a web application using Redux and nothing else but vanilla JavaScript. In this article I want to outline how I structured my app, examine some of my earlier (and ultimately unsuccessful) iterations, before looking at the solutions I settled on and what I learned along the way.
 

How to Test React Components Using Jest

How to Test React Components Using Jest Icon
In this article we will take a look at using Jest, a testing framework maintained by Facebook, to test our ReactJS components. We’ll look at how we can use Jest first on plain JavaScript functions, before looking at some of the features it provides out of the box specifically aimed at making testing React apps easier. It’s worth noting that Jest isn’t aimed specifically at React — you can use it to test any JavaScript applications. However, a couple of the features it provides come in really handy for testing user interfaces, which is why it’s a great fit with React.
 

Creating Universal Windows Apps With React Native

Creating Universal Windows Apps With React Native Icon
With the React Native Universal Windows platform extension, you can now make your React Native applications run on the Universal Windows families of devices, including desktop, mobile, and Xbox, as well as Windows IoT, Surface Hub, and HoloLens.
 

Building a Game with Three.js, ReactJS and WebGL

Building a Game with Three.js, ReactJS and WebGL Icon
Why React? I know what you’re thinking: why? Humor me for a moment. Here’s some reasons to consider using React to drive your 3D scene: “Declarative” views let you cleanly separate your scene rendering from your game logic. Design easy to reason about components, like <Player />, <Wall />, <Level />, etc.
 

Create a Simple To-Do App With React

Create a Simple To-Do App With React Icon
Learn the React basics by building a simple to-do application. As the topic implies, we are going to be building a To-Do application with React. Do not expect any surprises such as managing state with a state management library like Flux or Redux. I promise it will strictly be React. Maybe in following articles we can employ something like Redux but we want to focus on React and make sure everybody is good with React itself.
 

How To Scale React Applications

How To Scale React Applications Icon
Nowadays, due to rich web applications, scaling has become an important topic on the front end, too! The front end of a complex app needs to be able to handle a large number of users, developers and parts. These three categories of scaling (users, developers and parts) need to be accounted for; otherwise, there will be problems down the line.
 

Routing React Apps: The Complete Guide

Routing React Apps: The Complete Guide Icon
Route your React applications with ease. Learn all the fundamentals. In this guide, we will touch almost every aspect related to routing in React and there will be a demo so you will as well have something to play with.
 

How to Use the react-redux Package

How to Use the react-redux Package Icon
React is a JavaScript library for building user interfaces that has taken the web development world by storm. However, in a community that favours choice and flexibility, it can be hard to know where to start! Not to worry—some patterns and modules have emerged as best practices. One of these is Redux for managing application state.
 

React on the Server for Beginners: Build a Universal React and Node App

React on the Server for Beginners: Build a Universal React and Node App Icon
Build a super fast Universal JavaScript app that can be rendered both on the client and on the server using React, React Router and Express In this article we are going to learn how to build a simple "Universal JavaScript" application (a.k.a. "Isomorphic") using React, React Router and Express.
 

Build a React App with User Authentication

Build a React App with User Authentication Icon
React is an awesome way to build web UIs. This JavaScript library allows you to turn complex UIs into simple and reusable components that can be composed easily together. This post will show you how to build a React application from scratch, using the Stormpath React SDK to add features that allow people to sign up, login, and even view their own user profile.
 

Working with Data in React: Properties & State

Working with Data in React: Properties & State Icon
Managing data is essential to any application. Orchestrating the flow of data through the user interface (UI) of an application can be challenging. Often, today’s web applications have complex UIs such that modifying the data in one area of the UI can directly and indirectly affect other areas of the UI. Two-way data binding via Knockout.js and Angular.js are popular solutions to this problem.
 

Image Upload and Manipulation with React

Image Upload and Manipulation with React Icon
A common thing web developers need to do is give users the ability to upload images. At first it might seem trivial, but there are things to think about when building an image upload component. Here are just some of the considerations: What image types will you allow? What size do the images need to be? How will that impact performance?
 

Higher Order Components: A React Application Design Pattern

Higher Order Components: A React Application Design Pattern Icon
In this article we will discuss how to use Higher Order Components to keep your React applications tidy, well structured and easy to maintain. We’ll discuss how pure functions keep code clean and how these same principles can be applied to React components.
 

React.js in patterns

React.js in patterns Icon
Long time I was searching for a good front-end framework. Framework that will help me write scalable and easy to maintain UI. Even though React is just a library for rendering it comes with so many benefits that I can easily say “I found it”. And like every thing that I use a lot I started seeing some patterns. Techniques that are applied over and over again and I see in the code of other developers. It’s time that I start documenting, discussing and sharing these patterns.
 

Build complex mobile apps using NativeBase & React Native

Build complex mobile apps using NativeBase & React Native Icon
React Native is something I call a breakthrough in mobile app development; bringing the best of web development, making native app development how it’s supposed to be i.e. completely native. However, React Native has too low level APIs and small components where we end up rewriting many basic components ourselves for each project, which is where NativeBase fills in.
Home » React (60)
  • Page 1 of 3
  • »