Shopify App Tech. Stack

Shopify App Deployment Using Render.com

Shopify App의 경우 정식으로 App store에 등록을 하거나 Customer에게 커스터마이징된 App을 설치 해주려면 App을 Web Service로 등록을 해주어야 합니다. 이런 서비스를 제공 하는 회사들은 굉장히 많이 있습니다. 그 중 Shopify App을 등록하는데 가장 적합한 서비스중 하나가 Render 에서 제공하는 Web Service입니다. 그러나, 그 과정은 결코 간단하지 않습니다. Shopify 의 Remix App의 경우 여러가지 기술이 호합된...

Shopify 제품데이터를 가져와서 화면에 보여주는 코드 분석

Shopify API를 사용하면 외부 앱이 Shopify 스토어와 데이터를 주고받을 수 있습니다. 본 예제에서는 제품 목록을 가져와 React와 Polaris를 이용하여 Admin 스타일 테이블로 출력하는 전체 구현을 안내드립니다. 출력할 데이터는 제품 이미지, 타이틀, 상태, SKU, 바코드, 가격, 재고 수량, 상세 설명, 짧은 설명입니다. 백엔드 API 코드: /api/products (Node.js + Express) // /api/products.js import...

Shopify App 설정 파일들 분석

Shopify 앱 개발 프로젝트를 시작하면, 루트 폴더 안에 여러 개의 익숙하지 않은 설정 파일들이 자동으로 생성되어 있는 것을 볼 수 있습니다. 이 파일들은 대부분 Shopify CLI가 앱을 생성할 때 자동으로 만들어주는 기본 구조의 일부이며, 각각의 파일은 특정한 목적과 역할을 가지고 있습니다. 이 파일들의 기능과 내용, 그리고 수정 시 주의할 점을 알고 있어야 프로젝트를 안정적으로 유지하고 에러를 방지할 수 있습니다. 가장 핵심적인 파일은 package.json입니다....

Shopify Cli 란 무었인가요? 그리고 왜 필요한가요?

Shopify CLI란 무엇이며, 어떻게 작동하나요? Shopify 앱을 만들고 싶을 때 가장 먼저 설치하게 되는 도구 중 하나가 바로 Shopify CLI입니다. CLI는 “Command Line Interface”의 약자로, 명령어로 앱을 만들고 설정하고 실행할 수 있는 도구입니다. 처음 시작하는 분이라면 “이건 꼭 써야 하나요?”, “GUI도 없는데 이걸 왜 써야 하죠?” 같은 의문이 들 수 있습니다. 하지만 실제로 Shopify 앱을 개발할 때 CLI는 없어서는 안 될...

Node.js는 Shopify 앱의 핵심 엔진

Node.js란 무엇이며, Shopify 앱 개발에서 어떤 역할을 할까요? Shopify 앱을 개발하고 싶다고 했을 때 가장 먼저 듣게 되는 말이 있습니다. "Node.js부터 설치하세요"라는 말입니다. 하지만 개발을 처음 시작하는 분이라면, 이 말이 정확히 무슨 뜻인지 이해하기 어려울 수 있습니다. 이 글에서는 Node.js가 무엇인지, Shopify 앱에서 어떤 일을 하는지, 그리고 어떻게 사용하는지를 아주 쉽게 풀어 설명드리겠습니다. Node.js 란 무엇인가요?...

React 알아보기

Shopify 앱 개발을 위한 React 기초 완전 정리 Shopify 앱을 개발하려면 여러 가지 기술이 필요하지만, 그중에서도 화면을 구성하고 데이터를 표시하는 데 가장 중요한 기술이 바로 React입니다. React는 전 세계 수많은 웹사이트들이 사용하는 프론트엔드 라이브러리이며, Shopify도 자체 UI 툴킷인 Polaris를 React 기반으로 만들었기 때문에, 앱 개발에 있어 React는 사실상 필수입니다. 하지만 React는 처음 접하는 사람에게는 어렵게 느껴질...

Shopify App 개발에 필요한 기술 Stack

Shopify 앱 개발, 쉽지 않지만 충분히 도전할 만한 이유 온라인 쇼핑몰 시장은 빠르게 성장하고 있습니다. 그중에서도 Shopify는 전 세계 수백만 개의 브랜드가 선택한 대표적인 전자상거래 플랫폼입니다. Shopify에서 앱을 만든다는 것은 단순한 기술 개발을 넘어 글로벌 상점들과의 연결, 안정적인 수익 모델, 그리고 장기적인 SaaS 비즈니스 기회를 의미합니다. 하지만 한 가지 분명히 짚고 넘어가야 할 점이 있습니다. Shopify 앱 개발은 결코 쉽지 않습니다. 특히...

Remix 알아보기

Remix의 전체 개념과 Shopify 앱 개발에서의 역할 웹사이트나 웹 앱을 만드는 도구는 정말 많습니다. 그중에서도 Remix는 최근 많은 개발자들에게 주목받고 있는 신세대 웹 프레임워크입니다. React 기반이지만, 단순히 UI만 만드는 것이 아니라 웹사이트 전체 구조, 데이터 불러오기, 폼 처리, 에러 핸들링까지 모두 손쉽게 처리할 수 있는 올인원 도구입니다. Remix를 쉽게 말하자면, "React로 만든 웹사이트를 더 빠르고 똑똑하게 만들기 위한 프레임워크"입니다....

Shopify App 개발의 시작,Shopify Cli 설치

Shopify 앱 개발을 위한 전체 준비 가이드 (초보자용) Shopify 앱을 개발하려면 몇 가지 중요한 준비 작업과 필수 도구 설치가 필요합니다. 순서대로 따라 하면 개발 환경을 완벽하게 세팅할 수 있습니다. 1단계: Shopify Partner 계정 등록 이유: 왜 필요한가요? Shopify 앱을 만들기 위해서는 일반 스토어 계정이 아닌, Shopify Partner 계정이 필요합니다. 이 계정을 통해서만 다음 작업이 가능합니다: 개발용 스토어(Development...