GithubHelp home page GithubHelp logo

Comments (13)

kjin9174 avatar kjin9174 commented on May 5, 2024

You are wonderful.
I am starting game making with using react-game-kit
I've already installed nodejs.exe and executed "npm install react-game-kit --save" in command prompt
Then How should i start developing for react game.
I am nodejs amateur. so want you explain simply.Thanks

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

@kjin9174 I am using react native (the mobile development version of react) and you are using react(the web version) Our code will be similar, but not exactly the same. I am not going to write you a full-out checklist or anything, because the real triumph is learning how to come up with those steps yourself. To start, know your vocabulary. React is also known as "ReactJS" because it is written in JavaScript, and JavaScript has nothing to do with Java. Node is, from my understanding, is basically the way in which you can install external libraries and other people's addons such as this game kit. In order to make an app or website, you probably will use one or more libraries and will need to read the "Docs." This is essential, because each library has it's own uses and specifications you will need to adhere to. I would advise starting small, maybe making an extremely simple flappy bird game. Work up to making whatever game you are wanting to create. React is a big learning curve, but it is very do-able. A library called MobX is a very helpful library in javascript due to its easily modifiable global variables(state.) Good Luck!

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

I still need help though. If anyone knows a solution to my problem that would be appreciated

from react-game-kit.

ryan-roemer avatar ryan-roemer commented on May 5, 2024

@katzmannn -- Can you give us a code sample of what you're trying to do to help with more specificity for our understanding of the issue? Thanks!

Either code snippets here if apparent, or create a minimal repo with what you're trying to do and getting stuck on (and actually using react web would be preferable for ease of diagnosis, but RN's ok too). Then provide install + running steps + what to look for going wrong.

from react-game-kit.

kjin9174 avatar kjin9174 commented on May 5, 2024

Thanks for your reply.
I tried myself. But it is not working. I gonna make image animation first.
I run localhost:3000
I have already created app: okan
So i got react static screen by localhost:3000
I wanna use demo and samples of https://github.com/FormidableLabs/react-game-kit by customizing okan/src/app.js
my first example code is below
import React, { Component } from 'react';
import { Loop, Stage,World, Body, MySprite } from 'react-game-kit';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';

class Game extends Component {
render() {
return (
<Body
args={[0, 384, 64, 64, { inertia: Infinity }]}
ref={(b) => { this.body = b; }}
>


);
}
}

export default Game;

but this is error
TypeError: Cannot read property 'world' of undefined
new Body
C:/Program Files/nodejs/node_modules/react-game-kit/lib/components/body.js:48
45 | options = _objectWithoutProperties(props, ['args', 'children', 'shape']); // eslint-disable-line no-unused-vars
46 |
47 | _this.body = _matterJs.Bodies[shape].apply(_matterJs.Bodies, _toConsumableArray(args).concat([options]));

48 | _matterJs.World.addBody(context.engine.world, _this.body);
49 | return _this;
50 | }
51 |
View compiled
constructClassInstance
C:/Program Files/nodejs/okan/node_modules/react-dom/cjs/react-dom.development.js:6355
6352 | var unmaskedContext = getUnmaskedContext(workInProgress);
6353 | var needsContext = isContextConsumer(workInProgress);
6354 | var context = needsContext ? getMaskedContext(workInProgress, unmaskedContext) : emptyObject;
6355 | var instance = new ctor(props, context);
6356 | adoptClassInstance(workInProgress, instance);
6357 |
6358 | // Cache unmasked context so we can avoid recreating masked context unless necessary.
View compiled
updateClassComponent
C:/Program Files/nodejs/okan/node_modules/react-dom/cjs/react-dom.development.js:7839
7836 | if (current === null) {
........................

It seems like that i don't know method that use tags of react-game-kit package
If react-game-kit tags is working in my app.js, then i want to build for displaying my hosting webserver.
But i don't know well cause i am amateur.
Thanks for your advise.

from react-game-kit.

ryan-roemer avatar ryan-roemer commented on May 5, 2024

@kjin9174 is your query related to @katzmannn 's issue with multiple bodies or do you have a separate issue / are you just trying to learn react-game-kit? If the latter, can you either open a new issue or maybe ask on stack overflow to get help? Thanks!

from react-game-kit.

kjin9174 avatar kjin9174 commented on May 5, 2024

ok,cool

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

image
basically, I just want to be able to change the ref to enemy1, enemy2, etc... for each step of an array
something like ref={(b) => {enemy{index} = b}}

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

actually I solved it. funny how that happens. Basically i made an array and did this

image

i can reference it by doing this.props.store.enemies[0].body

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

wait nevermind, this actually creates infinite enemies lmao

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

How do you do this?
is there another way to do ref?

from react-game-kit.

ryan-roemer avatar ryan-roemer commented on May 5, 2024

@katzmannn -- I'm not quite following. Can you open up a minimal repository with install + error reproduction steps so we can jump in and see what's going wrong? Will greatly help us diagnose the core issue!

from react-game-kit.

micahkatz avatar micahkatz commented on May 5, 2024

@ryan-roemer I am basically trying to render bodies in an array. How would I approach this

from react-game-kit.

Related Issues (20)

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.