Coder Social home page Coder Social logo

elizad / grand-stack-movies-workshop Goto Github PK

View Code? Open in Web Editor NEW

This project forked from grand-stack/grand-stack-movies-workshop

0.0 1.0 0.0 2.85 MB

[Workshop] Build a simple movie recommendation web app using the GRAND Stack (GraphQL, React, Apollo, Neo4j Database)

JavaScript 69.88% HTML 24.20% CSS 5.92%

grand-stack-movies-workshop's Introduction

GRAND Stack Workshop

What is GRAND stack?

GraphQL, React, Apollo, Neo4j Database. The GRAND stack is a combination of modern technologies for building scalable applications for the web and mobile.

GraphQL

GraphQL is a query language and runtime for building APIs. Instead of defining many endpoints and the data returned by each endpoint, GraphQL uses a well-defined schema and type system to describe what data is available from the API. Using GraphQL, clients query for only the data they require.

React

React is a JavaScript library for building user interfaces. React is declarative and component-based, allowing for encapsulating UI logic in components that can be reused, composed, and combined to build powerful user interfaces.

Apollo

Apollo is a suite of open source tools for working with GraphQL. Apollo Client is a flexible, production ready GraphQL client for React and native apps.

Neo4j Database

Neo4j is a scalable native graph database that allows for flexible intuitive data modeling and fast near real time querying using Cypher, the query language for graphs.

Overview

The goal of this workshop is to build a simple movie recommendation web application making use of the GRAND stack.

The basic requirements are:

  • Allow the user to search for movies by title
  • Show movie details for each movie matching the search string
  • Show other recommended movies for each matching movie

// App architecture overview

This workshop covers

  • Modeling and querying data in Neo4j, including writing Cypher queries for generating personalized movie recommendations
  • Building a GraphQL API, including defining a schema, types, and queries, backed by Neo4j
  • Designing a React user interface frontend for searching and displaying movie details, including recommended movies
  • Using the Apollo Client integration

and is divided into three sections. Each section has a beginning skeleton state, but requires implementing some missing functionality before moving on to the next section. It is recommended to complete the workshop sections in the following order:

  1. Neo4j Database
  2. GraphQL
  3. React / Apollo

The workshop can be completed using the following hosted/demo service, without having to worry about setting up a local development environment (a link to the beginning skeleton state for each section is included in the README for each section):

or can be completed using standard developer tools by cloning this repository.

To begin the workshop, begin the Neo4j Database section.

grand-stack-movies-workshop's People

Contributors

gabrielamazonas avatar johnymontana avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.