퀵스타터즈
NativeScript용 백엔드 구축 방법은?

46min
소개
이 튜토리얼에서는 NativeScript의 백엔드를 구축하는 방법을 배우게 됩니다. 이는 모바일 앱을 위한 백엔드 개발을 간소화하는 오픈 소스 플랫폼인 Back4app을 사용합니다. 
우리는 데이터베이스 관리, 클라우드 코드 함수, REST 및 GraphQL API 엔드포인트, 사용자 인증, 실시간 쿼리(라이브 쿼리)와 같은 필수 Back4app 기능을 통합하여 NativeScript 앱을 위한 안전하고 확장 가능한 백엔드를 만드는 방법을 안내할 것입니다.
또한 Back4app이 수동 서버 및 데이터베이스 구성에 비해 설정 시간을 얼마나 크게 줄이는지 알게 될 것입니다. 
우리는 고급 보안 메커니즘, 클라우드 작업을 통한 작업 예약, 그리고 웹훅을 사용하여 제3자 서비스와 연결하는 방법을 탐구할 것입니다. 
이 가이드를 끝내면 NativeScript의 크로스 플랫폼 모바일 솔루션을 지원하는 NativeScript Core를 활용하는 유연한 백엔드를 갖게 됩니다.
이 기반을 통해 필요에 따라 자신만의 사용자 정의 논리 또는 외부 API를 통합할 준비가 될 것입니다. 이는 프로덕션 준비가 완료된 NativeScript 앱을 개발하는 데 중요한 단계가 될 것입니다.
전제 조건
Back4app 계정 및 새로운 Back4app 프로젝트
Back4app 시작하기.
계정이 없으신 경우 무료로 생성할 수 있습니다. 위 가이드를 따라 프로젝트를 준비하세요.
기본 NativeScript 개발 환경
NativeScript CLI 또는 다른 선호하는 워크플로를 사용하여 설정할 수 있습니다.
NativeScript 시작 가이드.﻿
Node.js (버전 14 이상) 설치
npm 패키지를 설치하고 NativeScript CLI를 실행하려면 Node.js가 필요합니다. Node.js 설치하기﻿
JavaScript 및 NativeScript Core에 대한 친숙함
NativeScript 공식 문서.
NativeScript가 처음이라면 시작하기 전에 공식 문서나 초보자 튜토리얼을 검토하세요.
시작하기 전에 모든 전제 조건이 준비되어 있는지 확인하세요. Back4app 프로젝트가 설정되고 로컬 NativeScript 환경이 준비되면 더 쉽게 따라갈 수 있습니다.
1단계 – Back4app 프로젝트 설정
새 프로젝트 만들기
NativeScript 백엔드를 Back4app에서 구축하는 첫 번째 단계는 새 프로젝트를 만드는 것입니다. 아직 하지 않았다면, 다음 단계를 따르세요:
Back4app 계정에 로그인하세요.
“새 앱” 버튼을 클릭하세요 Back4app 대시보드에서.
앱에 이름을 지정하세요 (예: “NativeScript-Backend-Tutorial”).
﻿
프로젝트를 만든 후, Back4app 대시보드에서 프로젝트가 나열된 것을 볼 수 있습니다. 이 프로젝트는 이 튜토리얼에서 다룰 모든 백엔드 구성의 기초가 될 것입니다.
Parse SDK 연결하기
Back4app은 데이터 처리, 실시간 기능, 사용자 인증 등을 위해 Parse 플랫폼을 사용합니다. NativeScript 앱을 Back4app에 연결하려면 parse npm 패키지를 설치하고 Back4app 대시보드에서 받은 자격 증명으로 초기화하세요.
Parse 키 가져오기:
Back4app 대시보드에서 앱의 “앱 설정” 또는 “보안 및 키” 섹션으로 이동하세요. 애플리케이션 ID, JavaScript 키, 및 Parse 서버 URL를 찾으세요 (형식: https://parseapi.back4app.com).
﻿
Parse SDK 설치:
Bash
npm install parse
npm install parse
﻿
그 다음, Parse 초기화를 구성 파일이나 주요 진입 파일(예: app.js)에서 수행합니다. 예를 들어, parseConfig.js라는 파일을 NativeScript 기반 프로젝트에 생성할 수 있습니다:
src/parseConfig.js
import Parse from 'parse';

// Replace the placeholders with your Back4app credentials
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';

export default Parse;
import Parse from 'parse';

// Replace the placeholders with your Back4app credentials
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';

export default Parse;
﻿
NativeScript 앱에서 Parse에 접근할 필요가 있을 때마다 이 파일을 가져오기만 하면 됩니다. 이 단계를 완료함으로써 NativeScript 프론트엔드와 Back4app 백엔드 간의 안전한 연결이 설정되어 데이터 작업이 간소화되었습니다.
2단계 – 데이터베이스 설정
데이터 저장 및 쿼리
Back4app 프로젝트가 준비되고 Parse SDK가 통합되면 NativeScript 앱에서 데이터를 저장하고 쿼리할 수 있습니다. 아래는 Parse.Object 클래스를 사용하여 항목 목록을 저장하고 가져오는 예입니다:
JS
// Example: Create a Task item
import Parse from './parseConfig';

async function createTaskItem(title, isCompleted) {
  const Task = Parse.Object.extend('Task');
  const task = new Task();
  task.set('title', title);
  task.set('isCompleted', isCompleted);

  try {
    const savedTask = await task.save();
    console.log('Task saved successfully:', savedTask);
    return savedTask;
  } catch (error) {
    console.error('Error saving Task:', error);
  }
}

// Example: Query all Task items
async function fetchTasks() {
  const Task = Parse.Object.extend('Task');
  const query = new Parse.Query(Task);

  try {
    const results = await query.find();
    console.log('Fetched Task items:', results);
    return results;
  } catch (error) {
    console.error('Error fetching Tasks:', error);
  }
}
// Example: Create a Task item
import Parse from './parseConfig';

async function createTaskItem(title, isCompleted) {
  const Task = Parse.Object.extend('Task');
  const task = new Task();
  task.set('title', title);
  task.set('isCompleted', isCompleted);

  try {
    const savedTask = await task.save();
    console.log('Task saved successfully:', savedTask);
    return savedTask;
  } catch (error) {
    console.error('Error saving Task:', error);
  }
}

// Example: Query all Task items
async function fetchTasks() {
  const Task = Parse.Object.extend('Task');
  const query = new Parse.Query(Task);

  try {
    const results = await query.find();
    console.log('Fetched Task items:', results);
    return results;
  } catch (error) {
    console.error('Error fetching Tasks:', error);
  }
}
﻿
직접 HTTP 호출을 선호하는 경우 Back4app의 REST API를 사용할 수도 있습니다:
Bash
curl -X POST \
  -H "X-Parse-Application-Id: YOUR_APPLICATION_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"title": "Buy supplies", "isCompleted": false}' \
  https://parseapi.back4app.com/classes/Task
curl -X POST \
  -H "X-Parse-Application-Id: YOUR_APPLICATION_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"title": "Buy supplies", "isCompleted": false}' \
  https://parseapi.back4app.com/classes/Task
﻿
또는 GraphQL을 사용하세요:
GraphQL
mutation {
  createTask(input: {
    fields: {
      title: "Clean the house"
      isCompleted: false
    }
  }) {
    task {
      objectId
      title
      isCompleted
    }
  }
}
mutation {
  createTask(input: {
    fields: {
      title: "Clean the house"
      isCompleted: false
    }
  }) {
    task {
      objectId
      title
      isCompleted
    }
  }
}
﻿
이 유연성 덕분에 Parse SDK, REST 또는 GraphQL API 엔드포인트를 통해 NativeScript 앱의 백엔드 기능을 편리하게 구축할 수 있습니다.
스키마 설계 및 데이터 유형
기본적으로 Parse는 자동으로 스키마를 생성할 수 있으며, Back4app 대시보드에서 클래스와 데이터 유형을 정의할 수도 있습니다:
Back4app 대시보드의 “데이터베이스” 섹션으로 이동하세요.
새 클래스를 생성하세요 (예: “Task”) 및 제목(String)과 완료 여부(Boolean)와 같은 열을 추가하세요.
새 클래스 생성
﻿
Back4app은 다음과 같은 데이터 유형을 지원합니다: 문자열, 숫자, 부울, 객체, 날짜, 파일, 포인터, 배열, 관계, 지점, 다각형. 객체를 처음 저장할 때 Parse가 이러한 열을 생성하도록 하거나 더 많은 제어를 위해 정의할 수 있습니다.
열 만들기
﻿
Back4app의 AI 에이전트 사용하기는 스키마를 자동으로 생성하는 데 도움이 될 수 있습니다:
AI 에이전트 열기 앱 대시보드에서.
원하는 데이터 모델 설명하기 (예: “모바일 앱을 위한 새로운 Task 클래스를 생성해 주세요. 필드는 isCompleted와 dueDate입니다.”).
에이전트가 스키마를 생성하도록 하세요 자동으로.
﻿
관계형 데이터
관계형 데이터가 필요하다면—여러 Category 객체가 여러 Task 항목을 가리키는 경우—Pointers 또는 Relations를 Parse에서 사용하세요:
JS
// Linking a Task to a Category with a pointer
async function createTaskForCategory(categoryObjectId, title) {
  const task = new Parse.Object('Task');
  const categoryPointer = new Parse.Object('Category');
  categoryPointer.id = categoryObjectId;

  task.set('title', title);
  task.set('category', categoryPointer);

  try {
    return await task.save();
  } catch (err) {
    console.error('Error creating Task with category relationship:', err);
  }
}

// Including the pointer data in a query
const query = new Parse.Query('Task');
query.include('category');
const tasksWithCategory = await query.find();
// Linking a Task to a Category with a pointer
async function createTaskForCategory(categoryObjectId, title) {
  const task = new Parse.Object('Task');
  const categoryPointer = new Parse.Object('Category');
  categoryPointer.id = categoryObjectId;

  task.set('title', title);
  task.set('category', categoryPointer);

  try {
    return await task.save();
  } catch (err) {
    console.error('Error creating Task with category relationship:', err);
  }
}

// Including the pointer data in a query
const query = new Parse.Query('Task');
query.include('category');
const tasksWithCategory = await query.find();
﻿
이 접근 방식은 Task와 관련된 Category의 전체 데이터를 단일 쿼리로 가져오는 데 도움이 됩니다.
실시간 쿼리
실시간 업데이트를 위해 Live Queries를 활성화하세요 Server Settings에서 Back4app 대시보드. NativeScript 개발자는 특정 클래스의 변경 사항을 구독할 수 있습니다. Live Query 서버 URL을 포함하도록 Parse 설정을 업데이트하세요:
src/parseConfig.js
import Parse from 'parse';

// Replace the placeholders with your Back4app credentials
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';
Parse.liveQueryServerURL = 'wss://YOUR_SUBDOMAIN_HERE.b4a.io'; 

export default Parse;
import Parse from 'parse';

// Replace the placeholders with your Back4app credentials
Parse.initialize('YOUR_APPLICATION_ID', 'YOUR_JAVASCRIPT_KEY');
Parse.serverURL = 'https://parseapi.back4app.com';
Parse.liveQueryServerURL = 'wss://YOUR_SUBDOMAIN_HERE.b4a.io'; 

export default Parse;
﻿
그리고 실시간 이벤트에 구독하세요:
JS
import Parse from './parseConfig';

async function subscribeToTasks(callback) {
  const query = new Parse.Query('Task');
  const subscription = await query.subscribe();

  subscription.on('create', (newTask) => {
    console.log('New Task created:', newTask);
    callback('create', newTask);
  });

  subscription.on('update', (updatedTask) => {
    console.log('Task updated:', updatedTask);
    callback('update', updatedTask);
  });

  subscription.on('delete', (deletedTask) => {
    console.log('Task deleted:', deletedTask);
    callback('delete', deletedTask);
  });

  return subscription;
}
import Parse from './parseConfig';

async function subscribeToTasks(callback) {
  const query = new Parse.Query('Task');
  const subscription = await query.subscribe();

  subscription.on('create', (newTask) => {
    console.log('New Task created:', newTask);
    callback('create', newTask);
  });

  subscription.on('update', (updatedTask) => {
    console.log('Task updated:', updatedTask);
    callback('update', updatedTask);
  });

  subscription.on('delete', (deletedTask) => {
    console.log('Task deleted:', deletedTask);
    callback('delete', deletedTask);
  });

  return subscription;
}
﻿
이 구독은 작업이 추가, 수정 또는 삭제될 때마다 UI를 자동으로 업데이트합니다—실시간 협업 NativeScript 앱에 완벽합니다.
3단계 – ACL 및 CLP로 보안 적용하기
Back4app 보안 메커니즘
Back4app은 액세스 제어 목록 (ACLs) 및 클래스 수준 권한 (CLPs)을 통합하여 데이터를 보호합니다. 이러한 보안 모델은 클래스 및 객체 수준에서 읽기/쓰기 액세스를 제어할 수 있게 해줍니다.
﻿
액세스 제어 목록 (ACLs)
ACL은 각 객체에 대한 권한을 설정합니다. 예를 들어, 소유자에게만 읽기 및 쓰기 권한을 부여하려면:
JS
async function createPrivateTask(title, ownerUser) {
  const Task = Parse.Object.extend('Task');
  const task = new Task();
  task.set('title', title);

  const acl = new Parse.ACL(ownerUser);
  acl.setPublicReadAccess(false);
  acl.setPublicWriteAccess(false);
  task.setACL(acl);

  try {
    return await task.save();
  } catch (err) {
    console.error('Error saving private task:', err);
  }
}
async function createPrivateTask(title, ownerUser) {
  const Task = Parse.Object.extend('Task');
  const task = new Task();
  task.set('title', title);

  const acl = new Parse.ACL(ownerUser);
  acl.setPublicReadAccess(false);
  acl.setPublicWriteAccess(false);
  task.setACL(acl);

  try {
    return await task.save();
  } catch (err) {
    console.error('Error saving private task:', err);
  }
}
﻿
이것은 지정된 사용자만 객체를 수정하거나 읽을 수 있도록 보장합니다.
ACL 편집
﻿
클래스 수준 권한 (CLPs)
CLP는 전체 클래스에 대한 기본 권한을 설정합니다:
데이터베이스 열기 Back4app에서 관련 클래스를 선택합니다.
클래스 수준 권한 탭에 접근합니다.
필요에 따라 공개, 인증된 사용자 또는 특정 역할에 대한 권한을 조정합니다.
﻿
ACL과 CLP를 결합하면 NativeScript 앱에 강력한 보안 모델을 제공합니다. 자세한 내용은 앱 보안 가이드라인을 참조하세요.
4단계 – 클라우드 함수 작성 및 배포
클라우드 코드는 서버 측에서 사용자 정의 JavaScript 코드를 실행할 수 있게 해주므로, 인프라를 직접 유지 관리할 필요가 없습니다. 이는 NativeScript 백엔드에 고급 논리 또는 서버 전용 통합을 추가하는 데 이상적입니다.
작동 방식
일반적으로 Cloud Code(자바스크립트 함수, 트리거 및 필요한 NPM 모듈)를 main.js 파일에 배치합니다. 그런 다음 Back4app에 배포하면 추가 서버 구성 없이 Parse Server 환경에서 실행됩니다.
예제 main.js 구조:
JS
const axios = require('axios');

Parse.Cloud.define('fetchExternalData', async (request) => {
  const url = request.params.url;
  if (!url) {
    throw new Error('URL parameter is required');
  }
  const response = await axios.get(url);
  return response.data;
});

Parse.Cloud.beforeSave('Task', (request) => {
  const task = request.object;
  if (!task.get('title')) {
    throw new Error('Task must have a title');
  }
});
const axios = require('axios');

Parse.Cloud.define('fetchExternalData', async (request) => {
  const url = request.params.url;
  if (!url) {
    throw new Error('URL parameter is required');
  }
  const response = await axios.get(url);
  return response.data;
});

Parse.Cloud.beforeSave('Task', (request) => {
  const task = request.object;
  if (!task.get('title')) {
    throw new Error('Task must have a title');
  }
});
﻿
HTTP 요청을 위해 axios와 같은 NPM 패키지를 설치하고 사용할 수 있습니다. 이 접근 방식은 결제 게이트웨이에서 외부 API에 이르기까지 다양한 통합을 가능하게 하며, 모두 Back4app 앱의 보안 뒤에 있습니다.
일반적인 사용 사례
비즈니스 로직: 자동 계산, 데이터 변환 또는 상태 업데이트.
데이터 검증: 저장하기 전에 필수 필드가 있는지 확인합니다.
트리거: 데이터가 생성, 업데이트 또는 삭제될 때 코드를 실행합니다.
통합: 결제, 분석 또는 메시징을 위한 외부 서비스와 연결합니다.
보안 집행: 진행하기 전에 수신 데이터 또는 사용자 역할을 검증합니다.
함수 배포
텍스트 길이를 계산하는 간단한 함수입니다:
main.js
Parse.Cloud.define('calculateTextLength', async (request) => {
  const { text } = request.params;
  if (!text) {
    throw new Error('No text provided');
  }
  return { length: text.length };
});
Parse.Cloud.define('calculateTextLength', async (request) => {
  const { text } = request.params;
  if (!text) {
    throw new Error('No text provided');
  }
  return { length: text.length };
});
﻿
배포하기 via Back4app CLI:
CLI 설치하기:
Bash
curl https://raw.githubusercontent.com/back4app/parse-cli/back4app/installer.sh | sudo /bin/bash
curl https://raw.githubusercontent.com/back4app/parse-cli/back4app/installer.sh | sudo /bin/bash
﻿
Windows의 경우, b4a.exe 파일을 릴리스 페이지에서 다운로드하세요.
계정 키 구성하기:
Bash
b4a configure accountkey
b4a configure accountkey
﻿
클라우드 코드 배포하기:
Bash
b4a deploy
b4a deploy
﻿
대시보드를 통한 배포:
대시보드에서 Cloud Code > Functions로 이동합니다.
함수 코드를 main.js에 붙여넣습니다.
클릭 배포.
﻿
함수 호출하기
NativeScript 앱에서 Parse SDK를 사용하여:
JS
import Parse from './parseConfig';

async function getTextLength(text) {
  try {
    const result = await Parse.Cloud.run('calculateTextLength', { text });
    console.log('Text length:', result.length);
  } catch (err) {
    console.error('Error calling cloud function:', err);
  }
}
import Parse from './parseConfig';

async function getTextLength(text) {
  try {
    const result = await Parse.Cloud.run('calculateTextLength', { text });
    console.log('Text length:', result.length);
  } catch (err) {
    console.error('Error calling cloud function:', err);
  }
}
﻿
REST 또는 GraphQL을 사용하여 호출할 수도 있습니다:
Bash
curl -X POST \
  -H "X-Parse-Application-Id: YOUR_APP_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"text": "Hello Back4app"}' \
  https://parseapi.back4app.com/functions/calculateTextLength
curl -X POST \
  -H "X-Parse-Application-Id: YOUR_APP_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"text": "Hello Back4app"}' \
  https://parseapi.back4app.com/functions/calculateTextLength
﻿
GraphQL
mutation {
  calculateTextLength(input: {
    text: "Hello GraphQL"
  }) {
    result
  }
}
mutation {
  calculateTextLength(input: {
    text: "Hello GraphQL"
  }) {
    result
  }
}
﻿
이것은 NativeScript 기반 모바일 앱에 서버 측 논리를 통합하는 유연한 방법을 제공합니다.
5단계 – 사용자 인증 구성하기
Back4app에서 사용자 인증
Back4app은 Parse User 클래스를 사용하여 인증을 처리하며, 여기에는 비밀번호 해싱, 세션 토큰 등이 포함됩니다. 이는 사용자 계정을 관리하는 데 관련된 많은 복잡성을 제거합니다.
사용자 인증 설정
NativeScript 앱에서 새 사용자를 생성할 수 있습니다:
JS
import Parse from './parseConfig';

async function signUpUser(username, password, email) {
  const user = new Parse.User();
  user.set('username', username);
  user.set('password', password);
  user.set('email', email);

  try {
    await user.signUp();
    console.log('User signed up successfully!');
  } catch (error) {
    console.error('Error signing up user:', error);
  }
}

async function logInUser(username, password) {
  try {
    const user = await Parse.User.logIn(username, password);
    console.log('User logged in:', user);
  } catch (error) {
    console.error('Error logging in user:', error);
  }
}
import Parse from './parseConfig';

async function signUpUser(username, password, email) {
  const user = new Parse.User();
  user.set('username', username);
  user.set('password', password);
  user.set('email', email);

  try {
    await user.signUp();
    console.log('User signed up successfully!');
  } catch (error) {
    console.error('Error signing up user:', error);
  }
}

async function logInUser(username, password) {
  try {
    const user = await Parse.User.logIn(username, password);
    console.log('User logged in:', user);
  } catch (error) {
    console.error('Error logging in user:', error);
  }
}
﻿
REST 예시는 다음과 같을 수 있습니다:
Bash
curl -X GET \
  -H "X-Parse-Application-Id: YOUR_APP_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -G \
  --data-urlencode 'username=alice' \
  --data-urlencode 'password=secret123' \
  https://parseapi.back4app.com/login
curl -X GET \
  -H "X-Parse-Application-Id: YOUR_APP_ID" \
  -H "X-Parse-REST-API-Key: YOUR_REST_API_KEY" \
  -G \
  --data-urlencode 'username=alice' \
  --data-urlencode 'password=secret123' \
  https://parseapi.back4app.com/login
﻿
세션 관리
로그인 후, Parse는 사용자에게 세션 토큰을 할당합니다. 현재 로그인한 사용자를 확인하려면:
JS
const currentUser = Parse.User.current();
if (currentUser) {
  console.log('Logged-in user:', currentUser.getUsername());
} else {
  console.log('No user is logged in');
}
const currentUser = Parse.User.current();
if (currentUser) {
  console.log('Logged-in user:', currentUser.getUsername());
} else {
  console.log('No user is logged in');
}
﻿
로그아웃은 간단합니다:
JS
await Parse.User.logOut();
await Parse.User.logOut();
﻿
소셜 로그인 통합
Parse는 Google 또는 Facebook과 같은 OAuth 제공자와 통합됩니다. 설정은 제공자마다 다르므로 Apple 및 기타로 로그인을 참조하십시오. 예를 들어, Facebook의 경우:
JS
const facebookLogin = async () => {
  try {
    const user = await Parse.FacebookUtils.logIn('email');
    console.log(user.existed() ? 'User logged in' : 'User signed up and logged in');
  } catch (error) {
    console.error('Error logging in with Facebook:', error);
  }
};
const facebookLogin = async () => {
  try {
    const user = await Parse.FacebookUtils.logIn('email');
    console.log(user.existed() ? 'User logged in' : 'User signed up and logged in');
  } catch (error) {
    console.error('Error logging in with Facebook:', error);
  }
};
﻿
이메일 인증 및 비밀번호 재설정
Back4app 대시보드에서 이러한 기능을 활성화하십시오:
이메일 설정으로 이동 하십시오.
이메일 인증 및 비밀번호 재설정을 활성화하십시오.
이메일 템플릿과 '보낸 사람' 주소를 구성하십시오.
6단계 – 파일 저장 처리
파일 업로드 및 검색
Back4app은 Parse.File 클래스를 통해 파일 관리를 지원합니다. NativeScript에서는 이미지나 문서를 유사하게 업로드할 수 있습니다:
JS
import Parse from './parseConfig';

async function uploadImage(file) {
  const name = file.name;
  const parseFile = new Parse.File(name, file);

  try {
    const savedFile = await parseFile.save();
    console.log('File saved:', savedFile.url());
    return savedFile.url();
  } catch (err) {
    console.error('Error uploading file:', err);
  }
}

async function createPhotoObject(file) {
  const Photo = Parse.Object.extend('Photo');
  const photo = new Photo();
  const parseFile = new Parse.File(file.name, file);
  photo.set('imageFile', parseFile);

  return await photo.save();
}
import Parse from './parseConfig';

async function uploadImage(file) {
  const name = file.name;
  const parseFile = new Parse.File(name, file);

  try {
    const savedFile = await parseFile.save();
    console.log('File saved:', savedFile.url());
    return savedFile.url();
  } catch (err) {
    console.error('Error uploading file:', err);
  }
}

async function createPhotoObject(file) {
  const Photo = Parse.Object.extend('Photo');
  const photo = new Photo();
  const parseFile = new Parse.File(file.name, file);
  photo.set('imageFile', parseFile);

  return await photo.save();
}
﻿
저장된 객체에서 파일의 URL을 검색할 수 있습니다:
JS
const imageFile = photo.get('imageFile');
const imageUrl = imageFile.url();
// Use imageUrl in your NativeScript UI components
const imageFile = photo.get('imageFile');
const imageUrl = imageFile.url();
// Use imageUrl in your NativeScript UI components
﻿
파일 보안
Parse Server를 사용하면 파일 업로드 보안을 구성할 수 있습니다:
JSON
{
  "fileUpload": {
    "enableForPublic": true,
    "enableForAnonymousUser": true,
    "enableForAuthenticatedUser": true
  }
}
{
  "fileUpload": {
    "enableForPublic": true,
    "enableForAnonymousUser": true,
    "enableForAuthenticatedUser": true
  }
}
﻿
이를 통해 보안 설정에 따라 파일 업로드를 제한하거나 허용할 수 있습니다.
7단계 – 클라우드 작업으로 작업 예약하기
클라우드 작업
클라우드 작업은 오래된 기록을 제거하거나 알림을 보내는 것과 같은 일상적인 작업을 자동화하는 데 도움을 줍니다. 예를 들어:
JS
// main.js
Parse.Cloud.job('cleanupOldTasks', async (request) => {
  const Task = Parse.Object.extend('Task');
  const query = new Parse.Query(Task);

  const now = new Date();
  const THIRTY_DAYS = 30 * 24 * 60 * 60 * 1000;
  const cutoff = new Date(now - THIRTY_DAYS);

  query.lessThan('createdAt', cutoff);

  try {
    const oldTasks = await query.find({ useMasterKey: true });
    await Parse.Object.destroyAll(oldTasks, { useMasterKey: true });
    return `Deleted ${oldTasks.length} old Tasks.`;
  } catch (err) {
    throw new Error('Cleanup error:' + err.message);
  }
});
// main.js
Parse.Cloud.job('cleanupOldTasks', async (request) => {
  const Task = Parse.Object.extend('Task');
  const query = new Parse.Query(Task);

  const now = new Date();
  const THIRTY_DAYS = 30 * 24 * 60 * 60 * 1000;
  const cutoff = new Date(now - THIRTY_DAYS);

  query.lessThan('createdAt', cutoff);

  try {
    const oldTasks = await query.find({ useMasterKey: true });
    await Parse.Object.destroyAll(oldTasks, { useMasterKey: true });
    return `Deleted ${oldTasks.length} old Tasks.`;
  } catch (err) {
    throw new Error('Cleanup error:' + err.message);
  }
});
﻿
CLI 또는 대시보드를 통해 이 작업을 배포합니다.
 Back4app 대시보드 > 서버 설정 > 백그라운드 작업, 매일 또는 원하는 간격으로 실행되도록 예약합니다.
클라우드 작업 예약
﻿
8단계 – 웹훅 통합
웹훅은 앱에서 특정 이벤트가 발생할 때 외부 서비스에 HTTP 요청을 보낼 수 있게 해줍니다—예를 들어 새로운 기록이나 사용자 가입과 같은 경우입니다. 이를 통해 Slack, 결제 게이트웨이 또는 분석 플랫폼과 통합할 수 있습니다.
Back4app 대시보드에서 웹훅 구성을 선택하고 웹훅 추가를 선택합니다.
당신의 엔드포인트 URL을 추가합니다 (예: https://your-service.com/webhook).
특정 클래스나 이벤트에 대한 트리거를 구성합니다.
웹훅 추가
﻿
또한 클라우드 코드에서 웹훅을 정의하거나 beforeSave 또는 afterSave와 같은 트리거에서 외부 API를 직접 호출할 수 있습니다.
BeforeSave WebHook
﻿
9단계 – Back4app 관리 패널 탐색
“Back4app Admin App”은 데이터 관리를 위한 모델 중심의 사용자 친화적인 인터페이스입니다. 이 앱은 팀이나 비기술 사용자가 CRUD 작업을 수행하고, 맞춤형 대시보드를 생성하며, 코드를 작성하지 않고도 기업 수준의 작업을 관리하는 데 도움을 줍니다.
관리 앱 활성화
“앱 대시보드”를 클릭한 후 더보기 > 관리 앱을 클릭합니다.
관리 앱 활성화.
관리 앱 활성화
﻿
첫 번째 관리자 사용자(사용자 이름/비밀번호)를 생성합니다. 이 설정은 “B4aAdminUserB4aSettingB4aMenuItem”, 등)를 스키마에 추가합니다.
﻿
서브 도메인을 선택한 후 새 관리자 자격 증명으로 로그인합니다:
﻿
﻿
이 포털은 그래픽 인터페이스를 떠나지 않고도 빠른 데이터 조작을 가능하게 합니다. 이는 코딩에 익숙하지 않은 팀원들과 협업하는 데 훌륭한 솔루션입니다.
결론
이 가이드를 따르면 NativeScript용 백엔드를 구축하는 방법을 배웠습니다 및:
안전한 백엔드를 생성했습니다 NativeScript 앱을 위한.
클래스, 스키마 및 관계로 구성된 데이터베이스를 설정했습니다.
실시간 쿼리를 구현했습니다 라이브 업데이트를 위해.
ACL 및 CLP로 데이터를 보호했습니다.
Cloud Code로 기능을 확장했습니다.
사용자 가입, 로그인 및 세션 토큰을 위한 인증을 설정했습니다.
Parse File을 통해 파일 업로드 및 검색을 관리했습니다.
자동화된 주기적 작업을 위한 Cloud Jobs를 예약했습니다.
타사 통합을 위한 Webhooks를 생성했습니다.
코드 없는 데이터 관리를 위한 Back4app 관리 패널을 사용했습니다.
이 단계는 NativeScript Core로 오픈 소스, 크로스 플랫폼 모바일 앱을 구축하기 위한 강력한 기반을 형성합니다. 고급 기능을 계속 탐색하고, 더 많은 API 엔드포인트를 통합하거나, 앱의 정확한 요구에 맞게 백엔드를 조정하기 위해 자체 사용자 정의 논리를 통합하세요.
다음 단계
NativeScript 앱을 성능, 캐싱 및 보안 규칙을 최적화하여 확장하세요.
역할 기반 권한과 같은 고급 사용자 관리 기능을 탐색하세요.
보안, 로그 및 성능에 대한 심층 가이드를 위해 공식 Back4app 문서를 확인하세요.
결제 또는 분석 도구와 같은 실제 통합을 실험해 보세요.
행복한 코딩을 하시고, Back4app이 제공하는 간소화된 개발 워크플로를 즐기세요!
업데이트됨 24 Jan 2025
이 페이지가 도움이 되었습니까?
htmx용 백엔드를 구축하는 방법?
ASP.NET Core용 백엔드 구축 방법은?