<commit_before>---
layout: post
title: How to modify React TodoMVC example to use a REST API and WebSockets
excerpt: Step by step guide how to modify Redux TodoMVC example to use Fake JSON Server as a REST API Back End to store the todo-data and use WebSockets for update notifications.
---

This post contains:
* __Step by step guide how to modify React TodoMVC example to use Fake JSON Server as a REST API Back End to store the todo-data and use WebSockets for update notifications__
* __How to test Fake JSON Server endpoints with Swagger and curl__

Starting point is the official [Redux TodoMVC](https://github.com/reactjs/redux/tree/master/examples/todomvc) example. The modified code can be found from [todomvc-fake-server](https://github.com/ttu/todomvc-fake-server) repository.

## Fake JSON Server

Fake JSON Server is a __REST API__ which uses __JSON flat file__ as a data store, so it can return predefined data from the JSON file and it updates the data to that same file. Data can be easily edited with any text editor. Fake JSON Server also has an experimental __GraphQL__ query support, so you can compare how REST requests would turn into GraphQL queries.

Fake JSON Server can be used as a simple Back End for prototyping or maybe as a Back End for some small project, when you don't want to use any extra setup time for the Back End.

Complete documentation and examples for [Fake JSON Server](https://github.com/ttu/dotnet-fake-json-server) can be found from Github. 

## Getting started

This example can be tried quickly by running Fake JSON Server from executable, from code or with Docker and by cloning modified TodoMVC repository.

##### 1) Start Fake JSON Server

__Option A:__ Start from the executable. This doesn't require any pre-installed frameworks or runtimes.

E.g. download latest version for _macOS 10.12 Sierra_. Check the correct file from your OS from the [README](https://github.com/ttu/dotnet-fake-json-server#self-contained-application)

```sh
$ mkdir FakeServer && cd FakeServer
$ wget https://github.com/ttu/dotnet-fake-json-server/releases/download/0.4.0/fakeserver-osx.10.12-x64.tar.gz
$ tar -zxvf fakeserver-osx.10.12-x64.tar.gz
$ chmod +x FakeServer
$ ./FakeServer
```
<commit_msg>Update guide to use new portable files<commit_after>---
layout: post
title: How to modify React TodoMVC example to use a REST API and WebSockets
excerpt: Step by step guide how to modify Redux TodoMVC example to use Fake JSON Server as a REST API Back End to store the todo-data and use WebSockets for update notifications.
---

This post contains:
* __Step by step guide how to modify React TodoMVC example to use Fake JSON Server as a REST API Back End to store the todo-data and use WebSockets for update notifications__
* __How to test Fake JSON Server endpoints with Swagger and curl__

Starting point is the official [Redux TodoMVC](https://github.com/reactjs/redux/tree/master/examples/todomvc) example. The modified code can be found from [todomvc-fake-server](https://github.com/ttu/todomvc-fake-server) repository.

## Fake JSON Server

Fake JSON Server is a __REST API__ which uses __JSON flat file__ as a data store, so it can return predefined data from the JSON file and it updates the data to that same file. Data can be easily edited with any text editor. Fake JSON Server also has an experimental __GraphQL__ query support, so you can compare how REST requests would turn into GraphQL queries.

Fake JSON Server can be used as a simple Back End for prototyping or maybe as a Back End for some small project, when you don't want to use any extra setup time for the Back End.

Complete documentation and examples for [Fake JSON Server](https://github.com/ttu/dotnet-fake-json-server) can be found from Github. 

## Getting started

This example can be tried quickly by running Fake JSON Server from executable, from code or with Docker and by cloning modified TodoMVC repository.

##### 1) Start Fake JSON Server

__Option A:__ Start from the executable. This doesn't require any pre-installed frameworks or prerequisites.

E.g. download latest version for _macOS_. Check the correct file for your OS from the [README](https://github.com/ttu/dotnet-fake-json-server#self-contained-application).

```sh
$ mkdir FakeServer && cd FakeServer
$ wget https://github.com/ttu/dotnet-fake-json-server/releases/download/0.4.0/fakeserver-osx-x64.tar.gz
$ tar -zxvf fakeserver-osx-x64.tar.gz
$ chmod +x FakeServer
$ ./FakeServer
```

{'fraction_non_alphanumeric': 0.06671143944481756, 'fraction_numerical': 0.006268188941123797, 'mean_word_length': 4.287573964497041, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 10, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6605788', 'n_tokens_mistral': 1324, 'n_tokens_neox': 1240, 'n_words': 618}