Giter Club home page Giter Club logo

dynasty-daddy-sleeper-mini's Introduction

Sleeper-Mini template

Sleeper

How to run

  1. This project requires a working setup of React Native. Follow the steps in this guide under the React Native CLI Quickstart tab.
  2. Sleeper uses the following tool versions for development. If you run into any issues with setup, you can try changing your environment to point to these versions. We recommend a version manager like asdf to automate switching these between projects.
Tool Version
XCode 15.0
MacOS 13.6
java zulu-11.56.19
nodejs 20.10.0
ruby 3.1.0
cocoapods 1.12.1
  1. Install the latest version of our custom vscode-react-native plugin. This is a fork of the official project that includes fixes to run webpack with react native.
  2. Clone this repo locally.
  3. Run yarn from the template/ folder and pod install from template/ios to set up node modules and native dependencies.
  4. If running in VS code, make sure to start the app from the vscode project file. This will automatically set your webpack dev server to the correct ports.
  5. If running manually, make sure to run with yarn start and yarn ios. These will also make sure your dev ports are set up correctly.

To connect with a running prod app on your local network:

  1. Contact us to enable developer mode on your account.
  2. Start up the Sleeper app. This can be the production app, a development mode app in a simulator or on device, or a Mac Catalyst build.
  3. If your account is marked as a developer, you may, at any point, physically shake your phone to open up a connection window. This displays your device's IP, current connection status to this template project on your computer, and buttons to refresh + send data manually to your PC at any time.
  4. Tap on the last tab in the tab bar at the bottom of the screen. Select "Developer Mini" from the list.
Simulator Screen Shot - iPhone 13 - 2023-04-07 at 14 38 02
  1. Copy the IP address from the dev menu, and paste it in app.json.
  2. Launch this app by following the steps in how to run above.
  3. If all goes well, the Sleeper app will automatically connect after a few seconds.
  4. You can now make any change you want in the mini, and when you hit the "refresh" button in Sleeper, the new code will update.

Editing the app

  1. We've prepackaged this project with a few starter templates, located here.
  2. Select a project to start with by editing app.json and changing the selected sample ID. Restart your packager each time you change this value.
  3. All user changes should hook into the main index.js file of the sample you selected from these folders. Feel free to delete or modify components as necessary, but refrain from modifying any library files or index.tsx, as those handle some behind the scenes communication events.
  4. Feel free to edit the top level package.json and add new packages to your project. Note that these packages either must already exist within Sleeper (if they include native code), or must be entirely comprised of javascript. For a list of packages included in Sleeper, check out mini_packages.json.
  5. Some types and components have been provided for use through an included @sleeperhq/mini-core package. You can check out the repo here.
  6. Further documentation and API hooks are in development.

Troubleshooting

Auto refresh stops working, or socket-related errors appear in the console.

Try restarting the phone that Sleeper is running on. Also stop and restart the packager for your development app.

How do I submit my mini?

You can run yarn build-mini to generate a .zip file containing all of your source code. Please contact us and send this file over when you are ready to release. In the future, this process will be automated.

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.