Appitr Documentation

Appitr IDE 1.0.0 version documentation Updated date: 06.04.2019


Introduction

Appitr is a online tool to help you build native iOS and Android projects using JavaScript and React Native. Create a native mobile app with online IDE within hours. Beautiful, simple and easiest way.

Features

  1. Fast Start
  2. Custom Components
  3. Online IDE
  4. Easy Build
  5. Native Apps
  6. No Install Requirement

How it works?

This tool uses "React Native for Web" for run the React Native projects.

"React Native for Web" makes it possible to run React Native components and APIs on the web using React DOM. Check out the projects of the React Native examples running on the web.

click for documentation

Getting Started #back to top

We’ll assume that you have some familiarity with HTML and JavaScript, but you should be able to follow along even if you’re coming from a different programming language. We’ll also assume that you’re familiar with programming concepts like functions, objects, arrays, and to a lesser extent, classes.

Note that we’re also using some features from ES6 — a recent version of JavaScript. In this tutorial, we’re using arrow functions, classes, let, and const statements. You can use the Babel REPL to check what ES6 code compiles to.

Here are what I consider to be prerequisites.

  1. Basic familiarity with HTML & CSS.
  2. Basic knowledge of JavaScript and programming.
  3. Basic understanding of the DOM.
  4. Familiarity with ES6 syntax and features.
  5. React.
  6. React Native.
  7. Basic using of npm packages.

Console #back to top

You can see the list of projects you have in the Appitr console. You can create a new project and delete the projects you have created.

Go to Console

How to create project? #back to top

When you click the plus button in the top box of the Appitr console, you can create a project by selecting the appropriate template from the window with the template options for your project. Your project will be automatically named by the system. Then you can enter title, description and keywords in your project.

Project Templates #back to top

The first template if you want to work in a completely empty application from three templates; the second template if you want to make an application that consists of the tab menu; if you want to work in an application with a left or right drawer, you can select the third template. Template examples can be viewed from the links below.

Cinque Terre Cinque Terre Cinque Terre

Privacy#back to top

If you don't want your project to be public, and you don't want it to appear outside appitr, you must change the privacy option to private before you create your project. After creating your project, you can change the privacy in the project settings section.

How to delete project?#back to top

After you create your project, the project list will be updated automatically and your project will be added to the list with the name created by the system. You can delete the project from the trash can icon on the top of the project box.

Project Settings#back to top

You can enter the titles, descriptions, and keywords of your public project here. You can also change the privacy of your project.

How to create file? #back to top

You can create a file by typing the folder name and file name that you want to create in the window that is opened by pressing the plus button next to the Files menu. You can also create files by selecting pages and components options. You can only create javascript file through this panel.

How to add dependency? #back to top

After clicking the plus button next to the Dependency menu, you can add system-supported npm packages to your project from the pop-up window. Find examples of using packages on the discover page.

Custom components #back to top

You can search for components from the Components section and add hundreds of ready components to your project with one click.

How to preview project? #back to top

You can preview your project by clicking the phone button in the menu. Logs will be reset in the log panel when you run the preview again.

How to see console logs? #back to top

You can see logs by clicking the exclamation button in the menu.

How to share project? #back to top

After you open the privacy of your project, you can get the iframe share code with the share button that will appear in the top menu.

Explore Projects #back to top

On the Explore page, you can see the source code that can filter out projects that are public on their keywords or dependency packages. Explore Projects