Code Monkey home page Code Monkey logo

sdk-for-react-native's Introduction

Appwrite React Native SDK

License Version Build Status Twitter Account Discord

This SDK is compatible with Appwrite server version 1.5.x. For older versions, please check previous releases.

Appwrite is an open-source backend as a service server that abstract and simplify complex and repetitive development tasks behind a very simple to use REST API. Appwrite aims to help you develop your apps faster and in a more secure way. Use the React Native SDK to integrate your app with the Appwrite server to easily start interacting with all of Appwrite backend APIs and tools. For full API documentation and tutorials go to https://appwrite.io/docs

Appwrite

Installation

To install

npx expo install react-native-appwrite react-native-url-polyfill

Getting Started

Add your Platform

If this is your first time using Appwrite, create an account and create your first project.

Then, under Add a platform, add a Android app or a Apple app. You can skip optional steps.

iOS steps

Add your app name and Bundle ID. You can find your Bundle Identifier in the General tab for your app's primary target in XCode. For Expo projects you can set or find it on app.json file at your project's root directory.

Android steps

Add your app's name and package name, Your package name is generally the applicationId in your app-level build.gradle file. For Expo projects you can set or find it on app.json file at your project's root directory.

Setup

On index.js add import for react-native-url-polyfill

import 'react-native-url-polyfill/auto'

If you are building for iOS, don't forget to install pods cd ios && pod install && cd ..

Init your SDK

Initialize your SDK with your Appwrite server API endpoint and project ID which can be found in your project settings page.

import { Client } from 'react-native-appwrite';
// Init your React Native SDK
const client = new Client();

client
    .setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
    .setProject('455x34dfkj') // Your project ID
    .setPlatform('com.example.myappwriteapp') // Your application ID or bundle ID.
;

Make Your First Request

Once your SDK object is set, access any of the Appwrite services and choose any request to send. Full documentation for any service method you would like to use can be found in your SDK documentation or in the API References section.

const account = new Account(client);

// Register User
account.create(ID.unique(), '[email protected]', 'password', 'Jane Doe')
    .then(function (response) {
        console.log(response);
    }, function (error) {
        console.log(error);
    });

Full Example

import { Client, Account } from 'react-native-appwrite';
// Init your React Native SDK
const client = new Client();

client
    .setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
    .setProject('455x34dfkj')
    .setPlatform('com.example.myappwriteapp') // YOUR application ID
;

const account = new Account(client);

// Register User
account.create(ID.unique(), '[email protected]', 'password', 'Jane Doe')
    .then(function (response) {
        console.log(response);
    }, function (error) {
        console.log(error);
    });

Learn more

You can use the following resources to learn more and get help

Contribution

This library is auto-generated by Appwrite custom SDK Generator. To learn more about how you can help us improve this SDK, please check the contribution guide before sending a pull-request.

License

Please see the BSD-3-Clause license file for more information.

sdk-for-react-native's People

Contributors

evdog4life avatar lohanidamodar avatar stnguyen90 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sdk-for-react-native's Issues

๐Ÿ› Bug Report: Query not Working.

๐Ÿ‘Ÿ Reproduction steps

When I try to use Query.search('title', query) , it works for all the worlds except words having 'a' as a character.

๐Ÿ‘ Expected behavior

It should be able to return data having title containing letter 'a' when I provide 'a' in the query.

๐Ÿ‘Ž Actual Behavior

Empty

๐ŸŽฒ Appwrite version

Version 0.10.x

๐Ÿ’ป Operating system

Windows

๐Ÿงฑ Your Environment

No response

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ› Bug Report: Can't use this sdk with bare react native

๐Ÿ‘Ÿ Reproduction steps

I just used this sdk with my bare react native project and encountern the error that this package uses expo-file-system and I have to use expo with my bare react native project, I can't affords using expo in my project because I am using some packages which not support expo. This package should be bare react native first then expo and you should mention in the docs that this package only for expo projects only. I know react native's official docs recommended to using expo so what? there are many comapines using bare react native in production and few using expo in production, because of one package we can't affords using expo.

๐Ÿ‘ Expected behavior

Should works fine with both workflow.

๐Ÿ‘Ž Actual Behavior

Actual Error:
Screenshot 2024-08-08 193117

๐ŸŽฒ Appwrite version

Different version (specify in environment)

๐Ÿ’ป Operating system

Windows

๐Ÿงฑ Your Environment

react-native-appwrite = 0.4.0

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿš€ Feature: expo-file-system

๐Ÿ”– Feature description

It's not feasible for Expo users if react-native-fs is used. Instead, it's better to use expo-file-system.

๐ŸŽค Pitch

use expo-file-system instead

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

[AppwriteException: Invalid `email` param: Value must be a valid email address]

๐Ÿ‘Ÿ Reproduction steps

I just simply trying to register user based on email and password. This function is responsible for createUser.

export async function createUser(email, password, userName) {
  try {

    const newAccount = await account.create(
      ID.unique(),
      email,
      password,
      userName
    );
    // .catch((error) => console.log(error));

    console.log(newAccount);
    if (!newAccount) throw Error;

    const avatarUrl = avatar.getInitials(userName);

    await signIn(email, password);

    const newUser = await databases.createDocument(
      appwriteConfig.databaseId,
      appwriteConfig.userCollectionId,
      ID.unique(),
      {
        accountId: newAccount.$id,
        email: email,
        userName: userName,
        avatar: avatarUrl,
      }
    );
    return newUser;
  } catch (error) {
    console.log(error);
    throw new Error(error);
  }
}

๐Ÿ‘ Expected behavior

It should register user but gives error

๐Ÿ‘Ž Actual Behavior

[AppwriteException: Invalid email param: Value must be a valid email address]

๐ŸŽฒ Appwrite version

Version 0.10.x

๐Ÿ’ป Operating system

Linux

๐Ÿงฑ Your Environment

No response

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ› Bug Report: Types import does not work

๐Ÿ‘Ÿ Reproduction steps

Import SDK using .ts file for types

๐Ÿ‘ Expected behavior

It should properly import the types

๐Ÿ‘Ž Actual Behavior

Shows that the declaration file cannot be found

๐ŸŽฒ Appwrite version

Version 0.10.x

๐Ÿ’ป Operating system

Linux

๐Ÿงฑ Your Environment

N/A

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ› Bug Report: realtime not working in react native expo

๐Ÿ‘Ÿ Reproduction steps

create a class for a client using react-native-appwrite sdk

import { Client ,Databases} from 'react-native-appwrite';

const client = new Client();
         client.setEndpoint('https://cloud.appwrite.io/v1')
                  .setProject('project_id')
                  .setplatform('host.exp.exponent') //bundle id
                  .setplatform('localhost')

export default client;
export const db = new Databases(client);


creating a listening function and using it in app


function App() {

    useEffect(() => {


        
        const unsubscribe = client.subscribe(`databases.${IDs.DatabaseId}.collections.${IDs.collectionId}.documents`, response => {

            console.log(response);

        });
        unsubscribe();
    }, []);

}



๐Ÿ‘ Expected behavior

it should console log a response

๐Ÿ‘Ž Actual Behavior

it will only work ( only on the web) if i use this
import { Client ,Databases} from 'appwrite';
instead of this
import { Client ,Databases} from 'react-native-appwrite';
the error :
image_2024-07-18_031948457

๐ŸŽฒ Appwrite version

Version 0.10.x

๐Ÿ’ป Operating system

Windows

๐Ÿงฑ Your Environment

No response

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ› Bug Report: Could not find a declaration file for module 'react-native-appwrite'. node_modules/react-native-appwrite/dist/cjs/sdk.js' implicitly has an 'any' type. Try `npm i --save-dev @types/react-native-appwrite` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-native-appwrite'

๐Ÿ‘Ÿ Reproduction steps

i created an empty expo app

npx create-expo-app my-app

install react-native-appwrite using this command

npx expo install react-native-appwrite react-native-url-polyfill

๐Ÿ‘ Expected behavior

it should typed correctly

๐Ÿ‘Ž Actual Behavior

image

๐ŸŽฒ Appwrite version

Different version (specify in environment)

๐Ÿ’ป Operating system

MacOS

๐Ÿงฑ Your Environment

v0.2.2

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ› Bug Report: React Native - createOAuth2Session throws error

๐Ÿ‘Ÿ Reproduction steps

Start a new React Native project.
Enable OAuth.

import React from 'react';
import {Button, Text, View} from 'react-native';
import {Client, Account} from 'appwrite';

const client = new Client()
  .setEndpoint('https://endpoint/v1')
  .setProject('12343455667');

const App = () => {
  function handleUserLogin() {
    const account = new Account(client);
    const session = account.createOAuth2Session('google');
    return session;
  }

  return (
    <View>
      <Text>Hello world</Text>
      <Button title="Login" onPress={handleUserLogin} />
    </View>
  );
};

๐Ÿ‘ Expected behavior

Should have opened a window for selecting an account from the OAuth client like google

๐Ÿ‘Ž Actual Behavior

Throwed Error

TypeError: Cannot set property href of [object WorkerLocation] which has only a getter

image

๐ŸŽฒ Appwrite version

Different version (specify in environment)

๐Ÿ’ป Operating system

Windows

๐Ÿงฑ Your Environment

I am using Appwrite v:1.0.1.500
React Native 0.70.1
React 18.1.0

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

๐Ÿ“š Documentation: need to import relevant class to create user without an error

๐Ÿ’ญ Description

import { Client, Account } from 'react-native-appwrite';
// Init your React Native SDK
const client = new Client();

client
.setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
.setProject('455x34dfkj')
.setPlatform('com.example.myappwriteapp') // YOUR application ID
;

const account = new Account(client);

// Register User
account.create(ID.unique(), '[email protected]', 'password', 'Jane Doe')
.then(function (response) {
console.log(response);
}, function (error) {
console.log(error);
});

in here instant of using
import { Client, Account } from 'react-native-appwrite';

need to use
import { Client, Account ,ID } from 'react-native-appwrite';

if not ID.unique() will not be work properly

๐Ÿ‘€ Have you spent some time to check if this issue has been raised before?

  • I checked and didn't find similar issue

๐Ÿข Have you read the Code of Conduct?

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.