DEV Community

loading...
Cover image for #30DaysofAppwrite : Your First Request
Appwrite

#30DaysofAppwrite : Your First Request

Damodar Lohani
・4 min read

Intro

Appwrite is an open-source, self-hosted Backend-as-a-Service that makes app development easier with a suite of SDKs and APIs to accelerate app development. #30DaysOfAppwrite is a month long event focussed at giving developers a walkthrough of all of Appwrite's features, starting from the basics to more advanced features like cloud functions! Alongside we will also be building a fully featured Medium Clone to demonstrate how these concepts can be applied when building a real world app. We also have some exciting prizes for developers who follow along with us!

Your First Request

Over the last few days, we've covered Appwrite's admin console, microservices layout, and installation. It's finally time to start a new project! Today, we're going to discuss beginning both web and Flutter applications, so let us get started.

Adding Platforms to Project

Adding platforms to the project helps us validate requests that come from clients. We validate the origin of the request against the platforms added in the project in the console. Any origin not matching the available platforms will be rejected.

Adding platform

On the console home page below the Usage graph, you can find the list of platforms and the Add Platform button. In order to add a new platform, you can simply tap the Add Platform button and select one of the available options. As of writing this tutorial, Web and Flutter platforms are the available options ( with more coming soon! ).

Add Platform

Web

To add a web platform, all you need is a name and host. Name can be anything you want to name your platform and the Host can be the domain under which your web project is running. For building and testing web projects locally, the host can be http://localhost.

Add Platform

Flutter

When adding a Flutter Platform, you have two options: Android and iOS. You can add either Android or iOS or both based on what platforms you're building for. You will be able to add other platforms like desktop once they are available.
Once you've selected Android or iOS, all you need is a name and the application id. Name can be anything you want to name your platform and the Application Id can be found in your project. For Android, it's found in your Flutter project's android/app/build.gradle file. For iOS, it can be found by opening your iOS app in XCode. Usually, by default, if you have not changed, it will be the same for both Android and iOS.

Add Platform

For Flutter web, you add the platform as Web as described above.

Well now you know what platforms are and how you can add them. Now you are ready to make valid requests to your Appwrite server and get back response. Let's look at how we can do that in both Web and Flutter projects.

Making Requests to Appwrite Server

Though we can make request to Appwrite server with direct REST API calls, using SDKs will make it a lot more structured and easier. So we will look into how we can make request to Appwrite server using Appwrite's official SDKs.

Web

Appwrite's Web SDK is very simple to use. You can add it to your project using a package manager like NPM or Yarn. The following command adds the Appwrite Web SDK to your project.

npm install appwrite
Enter fullscreen mode Exit fullscreen mode

Or you can install directly from CDN:

<script src="https://cdn.jsdelivr.net/npm/appwrite@2.0.0"></script>
Enter fullscreen mode Exit fullscreen mode

Once you add the dependency, you can now use the Appwrite SDK on your project. In order to make the request, we first need to initialize the SDK with endpoint and project details as follows:

var appwrite = new Appwrite();

appwrite
    .setEndpoint('http://localhost/v1') // Set your endpoint
    .setProject('455x34dfkj') // Your Appwrite Project UID
;
Enter fullscreen mode Exit fullscreen mode

Now let's make a request using our SDK.

// Register User
appwrite
    .account.create('me@example.com', 'password', 'Jane Doe')
        .then(function (response) {
            console.log(response);
        }, function (error) {
            console.log(error);
        });
Enter fullscreen mode Exit fullscreen mode

More information can be found on our Getting Started for Web guide.

Flutter

Appwrite's Flutter SDK is super easy to get started with. First you need to add the Appwrite's SDK as a dependency in your pubspec.yaml file:

dependencies:
    appwrite: ^0.5.0-dev.1 #use the latest version available
Enter fullscreen mode Exit fullscreen mode

Once the dependency is added and flutter pub get is run, you can import and use the Appwrite SDK in your project. Before making a request you must first initialize the SDK with the required endpoint and project ID.

import 'package:appwrite/appwrite.dart';

Client client = Client();

client
    .setEndpoint('https://localhost/v1') // Your Appwrite Endpoint
    .setProject('5e8cf4f46b5e8') // Your project ID
    .setSelfSigned() // Remove in production
;
Enter fullscreen mode Exit fullscreen mode

Now you can make requests and handle responses easily:

// Register User
Account account = Account(client);

Response user = await account
    .create(
        email: 'me@appwrite.io',
        password: 'password',
        name: 'My Name'
    );
Enter fullscreen mode Exit fullscreen mode

More information can be found on our Getting Started for Flutter guide.

Credits

We hope you liked this write up. You can follow #30DaysOfAppwrite on Social Media to keep up with all of our posts. The complete event timeline can be found here

Feel free to reach out to us on Discord if you would like to learn more about Appwrite, Aliens or Unicorns 🦄. Stay tuned for tomorrow's article! Until then 👋

Discussion (0)

Forem Open with the Forem app