alan345 / naperg Goto Github PK
View Code? Open in Web Editor NEWFullstack Boilerplate GraphQL. Made with React & Prisma + authentication & roles
License: MIT License
Fullstack Boilerplate GraphQL. Made with React & Prisma + authentication & roles
License: MIT License
Sorry if this is something I'm missing but I think I have everything setup.
The 3 processes and the docker. I can navigate to http://localhost:4466/my-app/dev in the browser
but when I try to create a user Project not found: 'my-app@dev
Maybe I'm missing something but it looks like it can't find the graphql server?
http://localhost:4466/my-app/dev Type "Node" is missing a "resolveType" resolver. Pass false into "resolverValidationOptions.requireResolversForResolveType" to disable this warning. Server is running on http://localhost:4000 Error: Not authorized at getUserId (/Users/gnb/Sites/naperg/server/src/utils.js:14:11) at me (/Users/gnb/Sites/naperg/server/src/resolvers/auth.js:17:14) at resolveFieldValueOrError (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:531:18) at resolveField (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:495:16) at /Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:364:18 at Array.reduce (<anonymous>) at executeFields (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:361:42) at executeOperation (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:289:122) at executeImpl (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:154:14) at Object.execute (/Users/gnb/Sites/naperg/server/node_modules/graphql/execution/execute.js:131:229) Request to http://localhost:4466/my-app/dev: query: query ($_v0_where: PostWhereInput) { posts(where: $_v0_where) { id text title isPublished nameFile __typename } } operationName: null variables: { "_v0_where": { "isPublished": true } } [GraphQL error]: Message: Project not found: 'my-app@dev', Location: undefined, Path: undefined [Network error]: Error: Project not found: 'my-app@dev' Error: Project not found: 'my-app@dev' at BatchedGraphQLClient.<anonymous> (/Users/gnb/Sites/naperg/server/node_modules/http-link-dataloader/dist/src/BatchedGraphQLClient.js:69:35) at step (/Users/gnb/Sites/naperg/server/node_modules/http-link-dataloader/dist/src/BatchedGraphQLClient.js:40:23) at Object.next (/Users/gnb/Sites/naperg/server/node_modules/http-link-dataloader/dist/src/BatchedGraphQLClient.js:21:53) at fulfilled (/Users/gnb/Sites/naperg/server/node_modules/http-link-dataloader/dist/src/BatchedGraphQLClient.js:12:58) at process._tickCallback (internal/process/next_tick.js:178:7)
Hi, i am trying to use this app as boilerplate. Everything works fine beside subscriptions.
If i send something in chat, i get an error. React or graphql playground result in same error.
{
"error": {
"name": "TypeError",
"message": "Cannot read property 'chat' of undefined"
}
}
Server Console doesn't throw any errors.
I am using node in version 9.8 and npm in version 6.4.1 on win 10. Someone can help me?
Question: does this boilerplate implement roles based permission on the front end? If so, where?
Hi @alan345,
Great boilerplate, thanks for the effort and work put into the project.
Just wanted to ask why you decided to go with mySQL over posgres for this boiler plate? Any particular reason?
Thanks
Hi,
an eror is thrown at signup, after entering a password:
Unhandled Rejection (TypeError): Cannot read property 'message' of undefined
(anonymous function)
src/components/user/auth/Signup.js:219
[ 216 |
217 | })
218 | .catch((e) => {
> 219 | this.child._openSnackBar(e.graphQLErrors[0].message)
220 | })
221 |
222 | }
Could you elaborate on exactly which settings server/src/config/config.js should contain?
Thanks in advance.
Never mind seems those are for the email service.
But when I execute docker-compose this is the error I'm getting:
Pulling prisma (prismagraphql/prisma:1.8)...
ERROR: Get https://registry-1.docker.io/v2/prismagraphql/prisma/manifests/1.8: unauthorized: incorrect username or password
On step 4 when tried to start Prisma I am getting an error.
/Users/dccecili/Projects/workplace/dccecili/PersonalProjects/naperg/server/index.js:10
...req,
^^^
SyntaxError: Unexpected token ...
at createScript (vm.js:56:10)
at Object.runInThisContext (vm.js:97:10)
at Module._compile (module.js:549:28)
at Object.Module._extensions..js (module.js:586:10)
at Module.load (module.js:494:32)
at tryModuleLoad (module.js:453:12)
at Function.Module._load (module.js:445:3)
at Module.runMain (module.js:611:10)
at run (bootstrap_node.js:394:7)
at startup (bootstrap_node.js:160:9)
npm ERR! Darwin 16.7.0
npm ERR! argv "/usr/local/Cellar/node@6/6.14.4/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v6.14.4
npm ERR! npm v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! my-app@ start: `node index.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the my-app@ start script 'node index.js'.```
Thank you for the great job you have done, and it is a brilliant project.
Just a question, I did not see Protected Endpoint / Resolvers mechanism in your project,
except the
const userId = getUserId(ctx)
... check userId here ...
So have you considered to achieve the Protected Endpoint / Resolvers ?
Doesn't run right now, not sure what should go in config.js
Line 12 in 13d00d5
Hi @alan345,
Thanks for making this boilerplate. Would you mind if I'll add it to https://github.com/catalinmiron/awesome-prisma?
Thanks!
correct error invitaton page
Hey,
Do you have any recommendation on how to host this boilerplate ?
Would be great if this boilerplate supported react-native. Here is a helpful article on the matter:
Hi Alan!
I would like to add a multi file upload for the "post" section but presently when I change the fileName to array it does not allow me to save it to graphql. I want to display and save many photos for a single post.
I have changed nameFile to an array in "createpage.js"
state = { title: '', text: '', nameFile:[], statusip:'', }
And I have changed the fileupload to accept multiple by assigning a multiple to the input. The system can receive the files but it doesnt seem to add into the database and I am unable to retrieve it from my Feed and Draft page.
`class UploadFile extends React.Component {
state = {
isEditMode: true,
imageURL: [],
}`
the input segment for UploadFile.js
{this.state.isEditMode && (
<form onSubmit={this.handleUploadImage}>
<input
className='f6 link dim br1 ba ph3 pv2 fr mb2 dib black'
ref={(ref) => { this.uploadInput = ref }}
onChange={this.handleUploadImage}
type='file' multiple/>
</form>
)}
In the GraphQL schema and i have also changed the file to array of string.
`type Post {
id: ID! @unique
isPublished: Boolean! @default(value: "false")
title: String!
text: String!
nameFile: [String!]!
author: User
cars: [Car!]!
}`
PS: Love your work.
/**
'use strict';
module.exports = (moduleName, instanceMethods) => {
const RealComponent = require.requireActual(moduleName);
const React = require('react');
const SuperClass =
typeof RealComponent === 'function' ? RealComponent : React.Component;
const Component = class extends SuperClass {
static displayName = 'Component';
render() {
const name =
RealComponent.displayName ||
RealComponent.name ||
(RealComponent.render // handle React.forwardRef
? RealComponent.render.displayName || RealComponent.render.name
: 'Unknown');
const props = Object.assign({}, RealComponent.defaultProps);
if (this.props) {
Object.keys(this.props).forEach(prop => {
// We can't just assign props on top of defaultProps
// because React treats undefined as special and different from null.
// If a prop is specified but set to undefined it is ignored and the
// default prop is used instead. If it is set to null, then the
// null value overwrites the default value.
if (this.props[prop] !== undefined) {
props[prop] = this.props[prop];
}
});
}
return React.createElement(
name.replace(/^(RCT|RK)/, ''),
props,
this.props.children,
);
}
};
Object.keys(RealComponent).forEach(classStatic => {
Component[classStatic] = RealComponent[classStatic];
});
if (instanceMethods != null) {
Object.assign(Component.prototype, instanceMethods);
}
return Component;
};
First of all, let me thank you for the great job you have done! I was looking for this kind of solution for a while.
I am still learning Prisma, so my question can be irrelevant. I wonder why your stack is using a separate express
server. I see that server
package/ folder already includes graphql-yoga
which is basically express
. Was the purpose of this to completely decouple server side from prisma? Where can I learn more about it?
Despite the setup is really good, this "boilerplate" contains an example of usage that can't be removed without changing half of the project.
It would be interesting to have a way to start the project as a boilerplate, so without content.
No cars, no posts, no feeds.
The RBA part is subject to discussion if it makes sense to be included in the boiler plate or not. I would vote for not.
Thanks for the contribution.
Really inspiring and helpful
As the uniqid documentation explains (here), it is generating a token by concatenating the time, mac address and process id. It is quite easy to get the process id and mac address and then generate token. Uniqid should be replace by a cryptographic strong random string generator: https://stackoverflow.com/questions/8855687/secure-random-token-in-node-js to replace uniqid here:
naperg/server/src/resolvers/auth.js
Line 25 in 315d6f5
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.