Book Image

ReactJS Blueprints

By : Sven A. Robbestad
Book Image

ReactJS Blueprints

By: Sven A. Robbestad

Overview of this book

<p>The JavaScript revolution has landed! ReactJS is one of those rare technologies that comes out of nowhere and turns established practices on their head. It provides a different way of thinking about how you should develop your apps, and has already gained a massive adoption among web developers. Join the revolution, build web apps faster, and have more fun developing!</p> <p>Packed with real-world code, this book starts by covering the idea behind ReactJS and the key concepts you must familiarize yourself with. You will learn how to bootstrap your ReactJS projects and you’ll also be provided with a handy scaffolding that you can use and reuse over and over.</p> <p>We then go on to cover a wide variety of apps, and will help you to structure and build your own components. Next, you will build a web shop, create a fully responsive and routable app, and also develop a real-time search app. Further on, you will be taught to work with public APIs to create a map-based application. You will also be taken through some advanced concepts such as <span id="description" class="sugar_field">Redux that are making a huge splash currently in the world of ReactJS. You’ll learn how to efficiently seal off your app for guest access, interact with hardware APIs, and create a photo app. You will then master the art of making your apps universal, and find out how to deploy them to the cloud. Finally, we wrap up the book as you are shown how to make a game. What better way to kick off your ReactJS development journey?</span></p>
Table of Contents (18 chapters)
ReactJS Blueprints
Credits
Foreword
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Chapter 4. Building a Real-Time Search App

Search is an important feature in most apps. Depending on the kind of application you're developing, you can get away with setting up a field for looking up simple keywords, or you may have to delve into a world of fuzzy algorithms and lookup tables. In this chapter, we'll create a real-time search app that mimics a web search engine. We'll work on quick searches that appear as you type, displaying the search results and providing the endless scrolling feature. We'll also create our own search API to handle our requests.

The application of these techniques are only limited by your imagination. On that note, let's get started.

These are the major topics that we'll cover in this chapter:

  • Creating your own search API

  • Connecting your API to MongoDB

  • Setting up API routing

  • Performing regex-based searches

  • Securing your API

  • Creating a ReactJS search app

  • Setting up react-router to handle non-hashed routes

  • Listening to event handlers

  • Creating a service layer

  • Connecting...