V3 2

.babelrc

@@ -1,14 +1,12 @@
 {
-  "presets": [
-    "react",
-    ["es2015", {modules: false, loose: true}]
-  ],
-  "env": {
-    "server": {
-      "plugins": ["transform-es2015-modules-commonjs"]
-    },
-    "test": {
-      "plugins": ["transform-es2015-modules-commonjs"]
-    }
-  }
+	"presets": [
+		"react",
+		["env", {
+			"targets": {
+				"browsers": "last 2 versions"
+			},
+			"loose": true,
+			"modules": false
+		}]
+	]
 }

.editorconfig

@@ -7,3 +7,4 @@ indent_size = 2
 end_of_line = lf
 charset = utf-8
 insert_final_newline = true
+trim_trailing_whitespace = true

.eslintignore

@@ -0,0 +1,2 @@
+public/
+node_modules/

.eslintrc.json

@@ -1,3 +1,22 @@
 {
-  "extends": ["standard", "standard-react"]
-}
+	"extends": [
+		"airbnb",
+		"prettier",
+		"prettier/react"
+	],
+	"plugins": [
+		"prettier"
+	],
+	"parserOptions": {
+		"ecmaVersion": 2016,
+		"sourceType": "module",
+		"ecmaFeatures": {
+			"jsx": true
+		}
+	},
+	"env": {
+		"es6": true,
+		"browser": true,
+		"node": true
+	}
+}

.gitignore

@@ -1,8 +1,13 @@
 public/bundle.js
 node_modules/
 .eslintcache
-coverage
+coverage/
 .nyc_output
 .DS_Store
+public/*bundle*
 *.map
 *.bundle.js
+_site/
+.sass-cache/
+*.iml
+.idea/

data.json

@@ -0,0 +1,124 @@
+{
+    "shows": [
+        {
+            "title": "Atlanta",
+            "year": "2008–2013",
+            "description": "Two cousins, with different views on art versus commerce, on their way up through the Atlanta rap scene; \"Earnest 'Earn' Marks,\" an ambitious college drop-out and his estranged cousin, who suddenly becomes a star.",
+            "poster": "a.jpg",
+            "imdbID": "tt4288182",
+            "trailer": "MpEdJ-mmTlY"
+        },
+        {
+            "title": "Billions",
+            "year": "2016–",
+            "description": "U.S. Attorney Chuck Rhoades goes after hedge fund king, Bobby \"Axe\" Axelrod in a battle between two powerful New York figures.",
+            "poster": "b.jpg",
+            "imdbID": "tt4270492",
+            "trailer": "_raEUMLL-ZI"
+        },
+        {
+            "title": "Black Mirror",
+            "year": "2011–",
+            "description": "A television anthology series that shows the dark side of life and technology.",
+            "poster": "bm.jpg",
+            "imdbID": "tt2085059",
+            "trailer": "jDiYGjp5iFg"
+        },
+        {
+            "title": "Breaking Bad",
+            "year": "2008–2013",
+            "description": "A high school chemistry teacher diagnosed with inoperable lung cancer turns to manufacturing and selling methamphetamine in order to secure his family's future.",
+            "poster": "bb.jpg",
+            "imdbID": "tt0903747",
+            "trailer": "XZ8daibM3AE"
+        },
+        {
+            "title": "Game of Thrones",
+            "year": "2011–",
+            "description": "Nine noble families fight for control over the mythical lands of Westeros, while a forgotten race returns after being dormant for thousands of years.",
+            "poster": "got.jpg",
+            "imdbID": "tt0944947",
+            "trailer": "giYeaKsXnsI"
+        },
+        {
+            "title": "Homeland",
+            "year": "2011–",
+            "description": "A bipolar CIA operative becomes convinced a prisoner of war has been turned by al-Qaeda and is planning to carry out a terrorist attack on American soil.",
+            "poster": "h.jpg",
+            "imdbID": "tt1796960",
+            "trailer": "KyFmS3wRPCQ"
+        },
+        {
+            "title": "House of Cards",
+            "year": "2013–",
+            "description": "A Congressman works with his equally conniving wife to exact revenge on the people who betrayed him.",
+            "poster": "hoc.jpg",
+            "imdbID": "tt1856010",
+            "trailer": "NTzycsqxYJ0"
+        },
+        {
+            "title": "Master of None",
+            "year": "2015–",
+            "description": "The personal and professional life of Dev, a 30-year-old actor in New York.",
+            "poster": "mon.jpg",
+            "imdbID": "tt4635276",
+            "trailer": "6bFvb3WKISk"
+        },
+        {
+            "title": "Narcos",
+            "year": "2015–",
+            "description": "A chronicled look at the criminal exploits of Colombian drug lord Pablo Escobar.",
+            "poster": "n.jpg",
+            "imdbID": "tt2707408",
+            "trailer": "U7elNhHwgBU"
+        },
+        {
+            "title": "Orange Is the New Black",
+            "year": "2013–",
+            "description": "The story of Piper Chapman, a woman in her thirties who is sentenced to fifteen months in prison after being convicted of a decade-old crime of transporting money for her drug-dealing girlfriend.",
+            "poster": "oitnb.jpg",
+            "imdbID": "tt2372162",
+            "trailer": "th8WT_pxGqg"
+        },
+        {
+            "title": "Silicon Valley",
+            "year": "2014–",
+            "description": "Follows the struggle of Richard Hendricks, a silicon valley engineer trying to build his own company called Pied Piper.",
+            "poster": "sv.jpg",
+            "imdbID": "tt2575988",
+            "trailer": "69V__a49xtw"
+        },
+        {
+            "title": "Stranger Things",
+            "year": "2016–",
+            "description": "When a young boy disappears, his mother, a police chief, and his friends must confront terrifying forces in order to get him back.",
+            "poster": "st.jpg",
+            "imdbID": "tt4574334",
+            "trailer": "9Egf5U8xLo8"
+        },
+        {
+            "title": "The Americans",
+            "year": "2013–",
+            "description": "Two Soviet intelligence agents pose as a married couple to spy on the American government.",
+            "poster": "ta.jpg",
+            "imdbID": "tt2149175",
+            "trailer": "HjuUkbhsI24"
+        },
+        {
+            "title": "Veep",
+            "year": "2012–",
+            "description": "Former Senator Selina Meyer finds that being Vice President of the United States is nothing like she hoped and everything that everyone ever warned her about.",
+            "poster": "v.jpg",
+            "imdbID": "tt1759761",
+            "trailer": "I2HoCG_iyhU"
+        },
+        {
+            "title": "Westworld",
+            "year": "2016–",
+            "description": "Set at the intersection of the near future and the reimagined past, explore a world in which every human appetite, no matter how noble or depraved, can be indulged without consequence.",
+            "poster": "ww.jpg",
+            "imdbID": "tt0475784",
+            "trailer": "eX3u0IlBBO4"
+        }
+    ]
+}

index.html

@@ -1,13 +1,11 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <title>Vidflix</title>
-  <link rel="stylesheet" href="/public/normalize.css" />
-  <link rel="stylesheet" href="/public/style.css" />
+	<meta charset="UTF-8">
+	<title>svideo</title>
 </head>
 <body>
-  <div id="app"><%= body %></div>
-  <script src="/public/bundle.js"></script>
+	<div id="app"></div>
+	<script src="public/bundle.js"></script>
 </body>
 </html>

js/ClientApp.jsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import { render } from 'react-dom';
+
+const ce = React.createElement;
+
+const MyTitle = function(props) {
+  return ce('div', null, ce('h1', { style: { color: props.color } }, props.title));
+};
+
+const MyFirstComponent = function() {
+  return ce(
+    'div',
+    { id: 'my-first-component' },
+    ce(MyTitle, { title: 'Game of Thrones', color: 'YellowGreen' }),
+    ce(MyTitle, { title: 'Stranger Things', color: 'GreenYellow' }),
+    ce(MyTitle, { title: 'Rick and Morty', color: 'LimeGreen' }),
+    ce(MyTitle, { title: 'House of Cards', color: 'peru' })
+  );
+};
+
+render(ce(MyFirstComponent), document.getElementById('app'));