Migrating to NextJs

.gitignore

@@ -1,10 +1,12 @@
 dist
 node_modules
 npm-debug.log
+.next
 .DS_STORE
 .nyc_output
 coverage
 .env
+build
 
 # Elastic Beanstalk Files
 .elasticbeanstalk/*

README.md

@@ -9,7 +9,7 @@
 [![Dependencies Status](https://david-dm.org/NYPL/sfr-bookfinder-front-end/status.svg)](https://david-dm.org/NYPL/sfr-bookfinder-front-end)
 [![devDependencies Status](https://david-dm.org/NYPL/sfr-bookfinder-front-end/dev-status.svg)](https://david-dm.org/NYPL/sfr-bookfinder-front-end?type=dev)
 
-ResearchNow front end application based on NYPL's React boilerplate code.
+ResearchNow front end application based on NYPL's React Design System.
 
 Provides a "Welcome page" entry point with heading, search box, and tagline. Connects to an ElasticSearch index via an API endpoint (https://platform.nypl.org/research-now/search-api).
 Simple keyword searches can be entered in the form and an index response is displayed back to
@@ -18,26 +18,24 @@ the user.
 ### Querying
 
 ### Requirements
-- React v15.5.4
-- React Router v3.0.5
-- Redux v4.0.1
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
 
 ### Installation
 Clone the repo and run `npm install`.
 ResearchNow also uses [webpub viewer] (https://github.com/NYPL-Simplified/webpub-viewer/tree/SFR-develop) to serve epubs.  Clone this branch and run `npm install` and `npm run streamed`
 
-For local development, run `npm run dev-start` to start the local server at `localhost:3001` with
+For local development, run `npm run dev` to start the local server at `localhost:3000` with
 default environment variables.
 
 Configurations are environment specific with different values per environment so it's necessary
 to set the appropriate environment when starting the application.
 
 ### Dependencies
 
-* ES6 - compiled with Babel and Webpack
+* NextJS
 * Redux
 * NYPL Header and Footer npm modules
-* Webpack
+* NYPL Design System
 
 ### Usage
 
@@ -66,3 +64,4 @@ Appending to URL doesn't work for more than one feature, to test more than one f
 ### Test
 
 To run unit tests, run `npm test` in the terminal. Or run `npm run test-with-coverage` to run the test and see the test coverage.
+

subjectListConfig.js → config/subjectListConfig.js

@@ -2,27 +2,27 @@
 const Subjects = [
   {
     text: 'Subject: Sub-saharan Africa',
-    url: 'search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"Sub-Saharan Africa"%2C"field"%3A"subject"}]'
+    url: '/search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"Sub-Saharan Africa"%2C"field"%3A"subject"}]'
     + '&showQueries=[{"query"%3A"Sub-Saharan Africa"%2C"field"%3A"subject"}]',
   },
   {
     text: 'Keyword: climate change',
-    url: 'search?showQueries=[{"query"%3A"Climate Change"%2C"field"%3A"keyword"}]&per_page=10&page=0&total=0&filters=[]&sort=[]'
+    url: '/search?showQueries=[{"query"%3A"Climate Change"%2C"field"%3A"keyword"}]&per_page=10&page=0&total=0&filters=[]&sort=[]'
     + '&queries=[{"query"%3A"Climate Change"%2C"field"%3A"keyword"}]',
   },
   {
     text: 'Title: New York City',
-    url: 'search?showQueries=[{"query"%3A"New York City"%2C"field"%3A"title"}]&per_page=10&page=0&total=0&filters=[]&sort=[]'
+    url: '/search?showQueries=[{"query"%3A"New York City"%2C"field"%3A"title"}]&per_page=10&page=0&total=0&filters=[]&sort=[]'
     + '&queries=[{"query"%3A"New York City"%2C"field"%3A"title"}]',
   },
   {
     text: 'Author: Corelli, Marie',
-    url: 'search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"Corellli%2C Marie"%2C"field"%3A"author"}]'
+    url: '/search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"Corellli%2C Marie"%2C"field"%3A"author"}]'
      + '&showQueries=[{"query"%3A"Corellli%2C Marie"%2C"field"%3A"author"}]',
   },
   {
     text: 'Keyword: cookbooks',
-    url: 'search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"cookbooks"%2C"field"%3A"keyword"}]'
+    url: '/search?per_page=10&page=0&total=0&filters=[]&sort=[]&queries=[{"query"%3A"cookbooks"%2C"field"%3A"keyword"}]'
     + '&showQueries=[{"query"%3A"cookbooks"%2C"field"%3A"keyword"}]',
   },
 ];

next-env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />

next.config.js

@@ -0,0 +1,11 @@
+const path = require("path");
+
+module.exports = {
+    webpack: config => {
+      config.resolve.alias['~'] = path.resolve(__dirname);
+      return config;
+    },
+    sassOptions: {
+        includePaths: [path.join(__dirname, 'styles')],
+    }
+  };