GraphQL first full-stack starter kit with Node, React. Powered by TypeScript

Overview

fullstack-starterkit

PRs welcome! Twitter: karan_6864

Motivation โญ

Setting up boiler plates when starting new projects is tedious sometimes and I often found myself setting it up from scratch ๐Ÿฅฑ

Hence I made this starterkit following some of the best patterns and practices I learnt from some of the larger codebase and fantastic developers I've had a chance to work with ๐Ÿ™Œ

The main purpose of this repository is to provide a scalable "batteries included" full stack starterkit which follows good architecture patterns (might be opinionated) and code decoupling which becomes significant as the project grows or new developers are onboarded

Features

  • All in Typescript Because TypeScript is awesome, and types are important ๐Ÿ˜ƒ

  • GraphQL First This starterkit is built with graphql first approach using the Apollo platform

  • Includes CI CI is integral part of any project. This starterkit includes Github Actions by default. PR's for integration with any other providers are welcome ๐Ÿ™Œ

  • Testing Focused This project uses Jest for testing framework and comes with sample tests which are easy to extend

  • Prisma Prisma is the ORM being used for PostgreSQL. Feel free to submit a PR for any other ORM or drivers you'd like to see here ๐Ÿ˜

  • PWA Support This starterkit comes with out of the box PWA support

Please leave a โญ as motivation if you liked the idea ๐Ÿ˜„

๐Ÿš€ Technologies Used

technologies

๐Ÿ“– Contents

Video Overview

Here's a brief video overview of this project, hope it helps.

Full Stack Starterkit Overview

Big thanks to @mikestaub for mentoring me on the lot of the ideas you will come across in this repository. Checkout how he's changing social media with Peapods

๐Ÿญ Architecture

Backend

Here is the folder structure for backend, it is using yarn workspaces which helps us split our monorepo into packages such as DB, GraphQL. Which if required can be made into their own micro services.

backend
โ”œโ”€โ”€ build
โ”œโ”€โ”€ config
โ”œโ”€โ”€ logs
โ”œโ”€โ”€ packages
โ”‚   โ”œโ”€โ”€ db
โ”‚   โ”‚   โ””โ”€โ”€prisma
โ”‚   โ”œโ”€โ”€ graphql
โ”‚   โ”‚   โ”œโ”€โ”€ api
โ”‚   โ”‚   โ”œโ”€โ”€ schema
โ”‚   โ”‚   โ””โ”€โ”€ types
โ”‚   โ””โ”€โ”€ utils
โ”œโ”€โ”€ tests
โ”‚   โ”œโ”€โ”€ db
โ”‚   โ””โ”€โ”€ graphql
โ”œโ”€โ”€ index.ts
โ””โ”€โ”€ package.json
DB

This workspace package contains the database abstractions. The database stack is PostgreSQL as relational database and Prisma as an ORM, read more about DB package here

GraphQL

The GraphQL package is organized as below:

graphql
โ”œโ”€โ”€ schema
โ”‚   โ””โ”€โ”€ user                <---- some entity
โ”‚       โ”œโ”€โ”€ resolvers 
โ”‚       โ”‚     โ”œโ”€โ”€ types     <---- type resolvers
โ”‚       โ”‚     โ”œโ”€โ”€ queries   <---- query resolvers
โ”‚       โ”‚     โ””โ”€โ”€ mutations <---- mutation resolvers
โ”‚       โ”œโ”€โ”€ queries.graphql
โ”‚       โ”œโ”€โ”€ mutations.graphql
โ”‚       โ””โ”€โ”€ types.graphql
โ”œโ”€โ”€ api
โ”‚   โ”œโ”€โ”€ queries             
โ”‚   โ””โ”€โ”€ mutations
โ”œโ”€โ”€ types                   <---- graphql types
โ”‚   โ”œโ”€โ”€ schema           
โ”‚   โ””โ”€โ”€ resolvers
โ””โ”€โ”€ index.json

The schema splits each entity into it's own set of schema to modularize the codebase. The graphql package uses schema stitching and code generators to construct the whole schema.

It is organized so because if you choose to split graphql into it's own set of microservices later, it should be relatively easier to do so as this should be easy to integrate with Apollo Federation

Read more about GraphQL package here

Web

Here is the folder structure for web, it is a standard create-react-app using craco to override configs without ejecting

Web package uses Material UI heavily as it makes theming and customization very easy. PR's for any other UI kit are welcome ๐Ÿ˜ƒ

web
โ”œโ”€โ”€ build
โ”œโ”€โ”€ public
โ”œโ”€โ”€ src
โ”‚   โ”œโ”€โ”€ assets
โ”‚   โ”œโ”€โ”€ config
โ”‚   โ”œโ”€โ”€ constants
โ”‚   โ”œโ”€โ”€ global
โ”‚   โ”œโ”€โ”€ tests
โ”‚   โ”œโ”€โ”€ layout     <---- controls, pure components
โ”‚   โ”œโ”€โ”€ theme      <---- theme config
โ”‚   โ”œโ”€โ”€ graphql
โ”‚   โ”‚   โ””โ”€โ”€ operations.tsx     <---- generated graphql operations and types
โ”‚   โ”œโ”€โ”€ pages
โ”‚   โ”‚   โ””โ”€โ”€  Home   <---- page component
โ”‚   โ”‚        โ”œโ”€โ”€ components <---- page specific components
โ”‚   โ”‚        โ””โ”€โ”€ hooks      <---- page specific custom hooks   
โ”‚   โ””โ”€โ”€ utils
โ”œโ”€โ”€ tests
โ”‚   โ”œโ”€โ”€ db
โ”‚   โ””โ”€โ”€ graphql
โ”œโ”€โ”€ index.ts
โ””โ”€โ”€ package.json

๐Ÿƒ Getting Started

Setting up environment variables

Before getting started, create .env files at both backend/.env as well as web/.env following the .env.template files located in those directories.

Install dependencies

I recommend using yarn instead of npm as this project heavily uses yarn workspaces

Install volta, which should automatically install correct node and yarn version when you checkout the repository (check the root package.json for config)

yarn

To install dependencies for web and backend automatically, a postinstall script has been added in the main package.json

Running backend

yarn start:backend

Make sure to use your own DATABASE_URL and not the default as provided in .env.template when developing your own project, as the demo database might be changed/deleted anytime

Running web

yarn start:web
Feel free to open a new issue if you're facing any problem ๐Ÿ™‹

Codegen

This starterkit uses graphql-code-generator to codegen lot of things like TypeScript types, React Apollo hooks and queries, GraphQL Schema AST etc.

cd backend
yarn generate:graphql
Codegen is also executed in yarn postinstall hook

๐Ÿ‘ How to Contribute

Contributions are welcome as always, before submitting a new PR please make sure to open a new issue so community members can discuss.

Additionally you might find existing open issues which can helps with improvements.

This project follows standard code of conduct so that you can understand what actions will and will not be tolerated.

๐Ÿ“„ License

This project is MIT licensed, as found in the LICENSE

Built and maintained with ๐ŸŒฎ by Karan

๐Ÿ’ผ Hire Me | ๐Ÿบ Donate

Comments
  • yarn command fails during install of @project-backend/db packages and generating prisma schema

    yarn command fails during install of @project-backend/db packages and generating prisma schema

    After following the instructions in the readme, I am having an issue with installing the backend dependencies. Please see the output from terminal below.

    $ yarn
    yarn install v1.22.5
    warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized loc
    k files. To clear this warning, remove package-lock.json.
    [1/4] Resolving packages...
    [2/4] Fetching packages...
    info [email protected]: The platform "win32" is incompatible with this module.
    info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
    [3/4] Linking dependencies...
    warning " > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > [email protected]" has unmet peer dependency "[email protected]^0.10.5 || ^0.11.3 || ^0.12.0 || ^0.13.0 || ^14.0.0".
    warning "apollo-server-express > [email protected]" has unmet peer dependency "[email protected]^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > [email protected]" has unmet peer dependency "[email protected]>=0.10.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^14.2.1 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected]^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > apollo-server-core > [email protected]" has unmet peer dependency "[email protected] - 14".
    warning "apollo-server-express > graphql-tools > [email protected]" has unmet peer dependency "[email protected]^0.11.3 || ^0.12.3 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "apollo-server-express > graphql-tools > [email protected]" has unmet peer dependency "[email protected]^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0".
    warning "workspace-aggregator-7d3ab4bd-a8ea-40e1-aad1-ca4a9144a6ec > @project-backend/graphql > @graphql-codegen/[email protected]" has unmet peer dependency "[email protected]^2.0.0".
    warning "workspace-aggregator-7d3ab4bd-a8ea-40e1-aad1-ca4a9144a6ec > @project-backend/graphql > graphql-tools > @graphql-tools/links > [email protected]" has unmet peer dependency "subscriptions-transport-ws
    @^0.9.0".
    [4/4] Building fresh packages...
    [9/9] โ ˆ @project-backend/db
    [-/9] โ  waiting...
    [-/9] โ  waiting...
    [-/9] โ  waiting...
    error C:\Users\Dev\Desktop\fullstack-starterkit-master\backend\node_modules\@project-backend\db: Command failed.
    Exit code: 1
    Command: yarn generate
    Arguments:
    Directory: C:\Users\Dev\Desktop\fullstack-starterkit-master\backend\node_modules\@project-backend\db
    Output:
    yarn run v1.22.5
    $ yarn prisma generate --schema=./prisma/schema.prisma
    $ C:\Users\Dev\Desktop\fullstack-starterkit-master\backend\node_modules\@project-backend\db\node_modules\.bin\prisma generate --schema=./prisma/schema.prisma
    internal/modules/cjs/loader.js:800
        throw err;
        ^
    
    Error: Cannot find module 'C:\Users\Dev\Desktop\fullstack-starterkit-master\backend\node_modules\node_modules\@prisma\cli\build\index.js'
        at Function.Module._resolveFilename (internal/modules/cjs/loader.js:797:15)
        at Function.Module._load (internal/modules/cjs/loader.js:690:27)
        at Function.Module.runMain (internal/modules/cjs/loader.js:1047:10)
        at internal/main/run_main_module.js:17:11 {
      code: 'MODULE_NOT_FOUND',
      requireStack: []
    }
    error Command failed with exit code 1.
    
    bug 
    opened by dustingauthier 3
  • Example and usage

    Example and usage

    Thanks for this starter it's really useful when you want to level upย on graphql. It would be quite useful to provide a small tutorial on how to add new models and use them in the client. There is quite a few scripts to run, generated files, and I think that a few lines in the REAMDME would flatten the learning curve quite a lot. For ex: I want to create a list of todos, and display it in the client somewhere.

    opened by gaultierq 3
  • missing graphql-codegen for react hooks

    missing graphql-codegen for react hooks

    The readme claims that types are important. I agree with that and I think this repo doesn't do the type safety justice. It really needs to have https://graphql-code-generator.com/ set up. Please include it in here. Most people don't know how to set it up from scratch and only by using that you can get 100% fullstack typesafety.

    If you don't know how to set it up, would you accept a PR with it?

    opened by capaj 3
  • .NET 5 backend implementation.

    .NET 5 backend implementation.

    Implement backend boilerplate using .NET 5 and HotChocolate

    It would be nice if we can have more options on the backend side for boilerplate because I've seen people struggling on the backend side where they don't really want to use JS/TS. So it will be nice if we can implement the backend boilerplate using C#.

    I've been working on creating a GraphQL API using .NET 5 (ongoing) - Socialize API. So happy to help on the implementation part.

    opened by gauravgupta98 2
  • Start backend and client under the same process?

    Start backend and client under the same process?

    I was thinking that we can add a devDependency to concurrently and start both components at the same time. What do you think? I have a commit ready to be submitted to PR

    opened by miguelhrocha 2
  • install workflow for production

    install workflow for production

    NODE_ENV set to 'production' will result in a failing yarn Indeed the postinstall steps depends on devDependencies which won't be available in production. Changing postinstall step in prepare could be an option to consider.

    bug good first issue 
    opened by gaultierq 2
  • Feature/graphql react codegen

    Feature/graphql react codegen

    CHANGELOG

    • added graphql codegen for
      • typescript-operations
      • typescript-react-apollo
    • updated codegen.yml config
    • generate web/src/graphql/operations.tsx
    • cleanup unnecessary query declarations
    • fix db clean up bug
    • update generate:schema -> generate:graphql

    Now with the generated web/src/types/graphql.tsx we can simply use typesafe query/mutation hooks generated from backend/packages/graphql/api rather than declaring twice (on web and backend)

    Example:

    import { GET_USER_QUERY } from '@web/graphql';
    
    const variables = {
      input: {
        id: 'demo_user_id'
      }
    };
    
    const { data, loading, error } = useQuery(GET_USER_QUERY, { variables });
    

    The above can now be written as:

    import { useGetUserQuery } from '@web/graphql';
    
    const variables = {
      input: {
        id: 'demo_user_id'
      }
    };
    
    const { data, loading, error } = useGetUserQuery({ variables });
    

    Thanks to @capaj for suggesting this improvement

    bug enhancement 
    opened by karanpratapsingh 2
  • Can't fetch yarn packages

    Can't fetch yarn packages

    When I run yarn command, I get this

    Yarn version: 
      1.22.4
    
    Node version: 
      12.13.1
    
    Platform: 
      linux x64
    
    Trace: 
      Error: https://registry.yarnpkg.com/@pm2/js-api/-/js-api-0.6.0.tgz: Request failed "404 Not Found"
          at ResponseError.ExtendableBuiltin (/home/venkat/.yarn/lib/cli.js:696:66)
          at new ResponseError (/home/venkat/.yarn/lib/cli.js:802:124)
          at Request.<anonymous> (/home/venkat/.yarn/lib/cli.js:67057:16)
          at Request.emit (events.js:210:5)
          at Request.module.exports.Request.onRequestResponse (/home/venkat/.yarn/lib/cli.js:141625:10)
          at ClientRequest.emit (events.js:210:5)
          at HTTPParser.parserOnIncomingClient [as onIncoming] (_http_client.js:583:27)
          at HTTPParser.parserOnHeadersComplete (_http_common.js:115:17)
          at TLSSocket.socketOnData (_http_client.js:456:22)
          at TLSSocket.emit (events.js:210:5)
    
    opened by venkatraj 2
  • chore(deps): bump ws from 5.2.2 to 5.2.3 in /web

    chore(deps): bump ws from 5.2.2 to 5.2.3 in /web

    Bumps ws from 5.2.2 to 5.2.3.

    Release notes

    Sourced from ws's releases.

    5.2.3

    Bug fixes

    • Backported 00c425ec to the 5.x release line (76d47c14).
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • chore(deps): bump color-string from 1.5.4 to 1.6.0 in /web

    chore(deps): bump color-string from 1.5.4 to 1.6.0 in /web

    Bumps color-string from 1.5.4 to 1.6.0.

    Release notes

    Sourced from color-string's releases.

    1.6.0

    Minor release 1.6.0

    • #55 - Add support for space-separated HSL

    Thanks @โ€‹htunnicliff for the contribution :)

    1.5.5 (Patch/Security Release) - hwb() ReDos patch (low-severity)

    Release notes copied verbatim from the commit message, which can be found here: 0789e21284c33d89ebc4ab4ca6f759b9375ac9d3

    Discovered by Yeting Li, c/o Colin Ife via Snyk.io.
    

    A ReDos (Regular Expression Denial of Service) vulnerability was responsibly disclosed to me via email by Colin on Mar 5 2021 regarding an exponential time complexity for linearly increasing input lengths for hwb() color strings.

    Strings reaching more than 5000 characters would see several milliseconds of processing time; strings reaching more than 50,000 characters began seeing 1500ms (1.5s) of processing time.

    The cause was due to a the regular expression that parses hwb() strings - specifically, the hue value - where the integer portion of the hue value used a 0-or-more quantifier shortly thereafter followed by a 1-or-more quantifier.

    This caused excessive backtracking and a cartesian scan, resulting in exponential time complexity given a linear increase in input length.

    Thank you Yeting Li and Colin Ife for bringing this to my attention in a secure, responsible and professional manner.

    A CVE will not be assigned for this vulnerability.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • build(deps): bump url-parse from 1.4.7 to 1.5.3 in /web

    build(deps): bump url-parse from 1.4.7 to 1.5.3 in /web

    Bumps url-parse from 1.4.7 to 1.5.3.

    Commits
    • ad44493 [dist] 1.5.3
    • c798461 [fix] Fix host parsing for file URLs (#210)
    • 201034b [dist] 1.5.2
    • 2d9ac2c [fix] Sanitize only special URLs (#209)
    • fb128af [fix] Use 'null' as origin for non special URLs
    • fed6d9e [fix] Add a leading slash only if the URL is special
    • 94872e7 [fix] Do not incorrectly set the slashes property to true
    • 81ab967 [fix] Ignore slashes after the protocol for special URLs
    • ee22050 [ci] Use GitHub Actions
    • d2979b5 [fix] Special case the file: protocol (#204)
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Prisma Backend api throwing openssl issue.

    Prisma Backend api throwing openssl issue.

    I am unable to access prisma back end API from client app . Invocation fails with OpenSSL issue . Can you please help me to fix this?

    OS: Ubuntu 20.04

    I have changed the binaryTargets to generator client { provider = "prisma-client-js" binaryTargets = ["debian-openssl-1.1.x"] }

    Query I am trying to execute is working fine in backend test package, but failed when same is requested from client,

    Code executed from client is,

    const { data, loading, error } = useGetUserQuery({ variables: { input: { id: 'abc' } // value for 'input' } }); console.log('data', data, loading, error);

    Error stack traces are ,

    Invalid prisma.user.findUnique() invocation:

    spawn node_modules/.prisma/client/query-engine-debian-openssl-1.1.x ENOENT, Location: [object Object], Path: getUser index.ts:28 data undefined true undefined index.tsx:48 data undefined false Error: Invalid prisma.user.findUnique() invocation:

    spawn node_modules/.prisma/client/query-engine-debian-openssl-1.1.x ENOENT ApolloError index.ts:49 getQueryResult QueryData.ts:366 node_modules vendors~main.chunk.js:7062 node_modules vendors~main.chunk.js:7001 result useBaseQuery.ts:65 useDeepMemo useDeepMemo.ts:18 useBaseQuery useBaseQuery.ts:64 useQuery useQuery.ts:12 useGetUserQuery operations.tsx:185 Welcome index.tsx:43 React 9 unstable_runWithPriority scheduler.development.js:468 React 5 onNewData useBaseQuery.ts:38 promise callbackonNewData useBaseQuery.ts:38 error QueryData.ts:305 notifySubscription Observable.js:140 onNotify Observable.js:179 error Observable.js:240 iterateObserversSafely iteration.ts:13 iterateObserversSafely iteration.ts:13 error ObservableQuery.ts:620 iterateObserversSafely iteration.ts:13 iterateObserversSafely iteration.ts:13 error Concast.ts:185 notifySubscription Observable.js:140 onNotify Observable.js:179 error Observable.js:240 promiseQueue asyncMap.ts:44 promise callbackmakeCallback/< asyncMap.ts:42 notifySubscription Observable.js:135 onNotify Observable.js:179 next Observable.js:235 iterateObserversSafely iteration.ts:13 iterateObserversSafely iteration.ts:13 next Concast.ts:171 notifySubscription Observable.js:135 onNotify Observable.js:179 next Observable.js:235 next index.ts:56 notifySubscription Observable.js:135 onNotify Observable.js:179 next Observable.js:235 createHttpLink createHttpLink.ts:153 promise callback*createHttpLink/</< createHttpLink.ts:149 Subscription Observable.js:197 subscribe Observable.js:279 onError index.ts:37 Subscription Observable.js:197 subscribe Observable.js:279 complete Concast.ts:210 node_modules vendors~main.chunk.js:9413 Concast Concast.ts:83 node_modules vendors~main.chunk.js:4562 node_modules vendors~main.chunk.js:4598 resultsFromLink QueryManager.ts:1091 node_modules vendors~main.chunk.js:4783 fromVariables QueryManager.ts:966 index.tsx:48 Worker registration successful http://localhost:3000/

    opened by rakeshn19 1
Owner
Karan Pratap Singh
Software Engineer & Solutions Architect
Karan Pratap Singh
Full Stack boilerplate with JWT Authentication - Built with React, Typescript, Node, Express, GraphQL, PostgreSQL, Redis, and Webpack

Full Stack boilerplate with JWT Authentication - Built with React, Typescript, Node, Express, GraphQL, PostgreSQL, Redis, and Webpack

Scott Jason 7 Sep 21, 2022
Ts-next-chakra-motion-kit - Starter kit with Next.js, Chakra-UI, Framer-Motion in Typescript

Typescript Next.js Chakra-UI Framer-Motion Starter Kit Start with a powerful tem

Alexandre Gossard 39 Oct 14, 2022
Starter Kit for Vite, React, TypeScript, Tailwind and Node.js ESM

Starter Kit for Vite, React, TypeScript, Tailwind and Node.js ESM Minimal, sensible defaults, fast. Read the blog post about this template. Technologi

Christoph Nakazawa 293 Dec 5, 2022
:point_up::running: Modern Relay Starter Kit - Integrated with Relay, GraphQL, Express, ES6/ES7, JSX, Webpack, Babel, Material Design Lite, and PostCSS

Relay Fullstack is a Relay scaffolding application that aims to help you get up and running a project without worrying about integrating tools. It com

Varayut Lerdkanlayanawat 992 Nov 5, 2022
StarHackIt: React/Native/Node fullstack starter kit with authentication and authorisation, data backed by SQL.

StarHackIt StarHackIt is a fullstack starter kit composed of: React web frontend Node backend React native mobile app Infrastructure as code with GruC

FredericH 1.3k Nov 15, 2022
React Package Starter - a simple and slightly opinionated starter kit for developing and publishing React packages

React Package Starter This is a simple and slightly opinionated starter kit for developing and publishing React packages. It comes with a several pre-

Tim Mikeladze 14 Nov 27, 2022
QABAS AL ANI 1 May 29, 2022
Create-t3-app - Interactive CLI to quickly set up an opinionated, full stack, typesafe NextJS project using the T3 Stack

create-t3-app Interactive CLI to quickly set up an opinionated, full stack, typesafe NextJS project using the T3 Stack Usage npm npx [email protected]

T3 Open Source 11.1k Dec 3, 2022
An easy and straight forward full-stack web application boilerplate using Node.js Express as backend and React as frontend.

An easy and straight forward full-stack web application boilerplate using Node.js Express as backend and React as frontend. All packages are structured as Yarn Workspaces and written in Typescript. In addition, the web application can be built as Docker image using a multi stage built supported Dockerfile.

null 22 Sep 18, 2022
Now UI Kit React - Free Bootstrap 4, React, React Hooks and Reactstrap UI Kit

Now UI Kit React is a free Bootstrap 4, React, React Hooks and Reactstrap UI Kit provided for free by Invision and Creative Tim. It is a beautiful cross-platform UI kit featuring over 50 elements and 3 templates.

Creative Tim 131 Nov 20, 2022
Tail-kit is a free and open source components and templates kit fully coded with Tailwind css 2.0.

Tail-Kit A beautiful and large components and templates kit for TailwindCSS 2.0 Tail-Kit is Free and Open Source. It does not change or add any CSS to

null 2.5k Dec 3, 2022
Full-stack React app built with Typescript, Bootstrap, Apollo client on the frontend, and NodeJS/Express, Typescript, Apollo server, and MongoDB/mongoose on the backend.

Event Scheduler App This project was bootstrapped with Create React App. Event Scheduler is a React app that allows users to create events. An event c

ahmed 8 Dec 1, 2022
dApp Starter Kit is flexible production grade Web3 boilerplate with Next.js, React, Material Design and Typescript

dApp Starter Kit is flexible production grade Web3 boilerplate with Next.js 12, React.js, Material-UI, Typescript and web3-react (beta).

ETH Salt Lake 8 Nov 1, 2022
Web3 Starter Kit is flexible production grade Web3 boilerplate with Next.js 12, React.js, Material-UI, Typescript and web3modal

Web3 Starter Kit is flexible production grade Web3 boilerplate with Next.js 12, React.js, Material-UI, Typescript and web3modal

ETH Salt Lake 8 Nov 1, 2022
Starter Kit ReactJs + Typescript + Chakra-UI + AuthContext

This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: yarn start Runs the app in the developme

Leonardo Frasson 1 Dec 8, 2021
Node.js / GraphQL project template pre-configured with TypeScript, PostgreSQL, login flow, transactional emails, unit tests, CI/CD workflow.

Node.js API Starter Kit Node.js API Starter Kit is a project template for building Node.js backend applications optimized for serverless infrastructur

Kriasoft 119 Nov 16, 2022
A GraphQL-powered, single-page dashboard application for Saleor.

Saleor Dashboard A GraphQL-powered, single-page dashboard application for Saleor. Demo See the public demo of Saleor Dashboard! Or launch the demo on

Saleor Commerce 605 Dec 1, 2022
updated frontend template for full stack evm-based dapps. tools: typescript, hardhat, ethers, solidity, react

updated frontend template for full stack evm-based dapps. tools: typescript, hardhat, ethers, solidity, react

Steven Li 0 Oct 31, 2021
React/Redux stack (not a boilerplate kit)

Reactuate Reactuate is an opinionated stack for building React/Redux-based frontend applications with a focus on DDD (Domain-Driven Design). The ratio

null 490 Sep 25, 2022