꼰대의 Python Archive

카메라로 촬영한 사진을 보여주거나 갤러리에서 선택한 이미지를 보여주는 App을 만들어보겠습니다. 일단 화면은 상단에 버튼이 있고 버튼을 클릭하면 카메라를 사용할 것인지 갤러리를 사용할 것인지 선택하는 메뉴가 나오고 카메라로 촬영하거나 갤러리에서 선택한 사진을 사진 경로와 함께 표시하겠습니다. 화면은 아래와 같습니다. Button이 있고 다음으로 경로를 표시할 Paragraph, 그리고 이미지를 표시 할 Image를 배치합니다. 다음으로 COMPONENT MARKET에서 Function을 추가해야합니다. 하단 Show logic for~를 클릭하고 좌측 상단 메뉴에서 FLOW FUNCTION MARKET 버튼을 클릭하여 MARKET으로 들어가 상단 메뉴에서 Frontend login을 선택한 다음 pick..

1편 마지막에서 언급했듯이 GPS 좌표값을 못가져 왔을 때를 대비해 네트워크 정보를 통해 좌표값을 가져와 OpenWeather에 보내는 로직을 추가하겠습니다. 2021.06.11 - [Builders/Appgyver] - [Appgyver] 휴대폰 GPS값을 이용한 날씨 정보 조회 (1편) [Appgyver] 휴대폰 GPS값을 이용한 날씨 정보 조회 (1편) Appgyver가 어렵긴 하지만 지원하는 옵션들이 많아 이것저것 만들어 볼 수 있습니다. 이번에는 GPS 좌표를 이용한 현재 위치의 날씨 정보를 조회하여 보여주는 앱을 만들어 보겠습니다. 우선 날씨 ggondae.tistory.com 먼저 네트워크 정보로 좌표값을 주는 곳은 아래와 같습니다. https://ipwhois.app/ IP Geolocat..

Appgyver가 어렵긴 하지만 지원하는 옵션들이 많아 이것저것 만들어 볼 수 있습니다. 이번에는 GPS 좌표를 이용한 현재 위치의 날씨 정보를 조회하여 보여주는 앱을 만들어 보겠습니다. 날씨 정보를 가져올 API를 살펴보겠습니다. 날씨 정보하면 기상청 API를 생각할 수 있겠지만 격자정보 기준으로 요청해야해서 GPS 좌표를 격자 정보로 변환해야하는 번거로움이 있고 Appgyver에서는 이 또한 쉽지 않기 때문에 GPS 좌표값으로 기상정보를 제공하는 OpenWeather를 이용하도록 하겠습니다. https://openweathermap.org/ Сurrent weather and forecast - OpenWeatherMap Access current weather data for any location..

식품의약품안전처 제공 API 보다보니 유통바코드 정보가 있어 물류는 잘 몰라 조금 찾아보니 상품 바코드와는 다른 개념인 듯 합니다. Appgyver의 바코드 스캐너를 이용해 바코드 조회 결과를 보여주는 App을 만들어 보겠습니다. 우선 API 구조를 살펴보겠습니다. 아래 링크로 들어가 식약처 URL로 이동한 다음 회원가입하고 신청하면 다음날쯤 API KEY를 줍니다. https://www.data.go.kr/data/15064775/openapi.do 식품의약품안전처_유통바코드 유통상 바코드 식별 정보 www.data.go.kr 요청 URL 구조는 아래와 같습니다. 기본 요청 값은 URL Path에 포함되고 추가 옵션은 파라미터로 들어갑니다. 요청인자값 중 5번까지는 필수입니다. 그리고 6번부터는 옵션인..

바인딩 관련 예제를 작성합니다. 목표는 변수 A와 바인딩 된 Pragraph이 있고 input 필드를 변수 A와 바인딩하여 input필드 값에 value를 입력하면 Pragraph에 해당 값이 출력되도록 하겠습니다. 새로운 캔버스에 Paragraph와 Input 컴포넌트를 생성합니다. 다음으로 상단 VARIABLES 슬라이드바를 클릭하여 좌측 메뉴 PAGE VARIABLES를 선택하고 ADD PAGE VARIABLE을 클릭한다음 Variable name은 "input", Initial value는 "Welcom"으로 입력한 후 저장합니다. 다시 VIEW 화면으로 돌아와서 Paragraph 1에 변수명을 지정해야합니다. (맨 위 설명에서 변수 A에 해당합니다.) 이를 위해 우측 메뉴에서 Content 아이..

상단 VARIABLES 슬라이드 바를 선택하면 좌측 메뉴에 많은 변수 및 파라미터 값 설정이 있습니다. 오늘은 페이지 변수(Page Variables)에 대해 확인해 보겠습니다. 설명은 다음과 같습니다. Page variables exist in the context of the current page. They are initialized when the page opens, and removed from app state when the page is closed. They should be used for things that exist in the context of the current page, such as form data, loading state of the current page, s..

1. 페이지 생성 좌측 상단 링크를 클릭하고 ADD NEW PAGE를 클릭합니다. 페이지명을 입력하여 과일정보 상세 페이지를 생성합니다. 2. 변수설정 과일 상세페이지에서 사용할 변수를 정의하고 데이터 바인딩해야 합니다. 상단 슬라이드를 VARIABLE를 선택하고 좌측 메뉴에서 PAGE PARAMETERS를 선택한다. 페이지 파라미터는 리스트에서 과일명을 선택할 때 넘겨 받을 변수명을 정의하며 유일한 값인 ID값을 파라미터로 받아야하기 때문에 Parameter name을 fruit_id로 입력하고 저장합니다. 좌측 메뉴에서 DATA VARIABLES를 클릭하고 우측 ADD DATA VARIABLE을 클릭, Resource ID인 fruits를 선택합니다. 변수명을 입력하고 Single data recor..

1. 프로젝트 생성 "과일정보"라는 이름으로 새로운 프로젝트를 생성합니다. 우측 Page name은 현재 페이지의 이름으로 과일전체정보라는 이름으로 정하고 모든 과일을 리스트 형태로 보여주겠습니다. 2. Data Resource 셋팅 상단 툴바의 DATA 메뉴을 선택합니다. 바뀐 화면에서 우측 상단 ADD DATA RESOURCE를 클릭하고 REST API direct integration을 선택합니다. 이전 게시물에서 확인하였던 REST API 관련 데이터를 확인합니다. 확인할 내용은 총 3가지 입니다. - Base URL - 인증 키와 값 - GET 파라미터 변수명과 값 좌측 메뉴 중 BASE를 선택하고 Resource ID는 fruits로 정의하고 Resource URL은 위 정보의 Base URL..

과일정보의 최종 완성 모습입니다. 페이지를 열면 미리 저장한 과일정보가 리스트로 출력됩니다. 리스트 페이지에서는 과일 이름과 평점을 별 아이콘으로 표시합니다. 과일 이름을 클릭하면 해당 과일의 상세 페이지로 이동합니다. 상세 페이지에서는 과일 이름과 사진, 설명이 표시됩니다. 참고로... 휴대폰 화면으로 보고 싶다면 앱스토어 들어가셔서 appgyver 검색 하시면 어플이 있습니다. 해당 어플 설치하시면 작업중인 프로젝트 확인이 가능합니다. 1. Data Resource 데이터베이스는 REST API를 지원하며 간단하게 사용할 수 있는 Airtable을 이용합니다. Airtable은 무료 계정 가입할 수 있으며 Airtable 관련 자세한 내용은 여기서 설명하지 않겠습니다. https://www.airta..

요즘 코딩 없이 App을 개발할 수 있는 도구들이 많이 나옵니다. 유투브를 보다보니 아래와 같이 NO-CODE 빌더를 소개하는 내용도 있더군요. https://www.youtube.com/watch?v=3_ftZdc-sYI&t=261s 그 중 Appgyver을 몇달 전에 알게 되었고 이번에 백수된 김에 자세히 공부해보려 합니다. Appgyver 1. URL : https://appgyver.com/ AppGyver The world's first professional no-code platform to build React and React Native based apps for mobile, web and more. Sign up for the free-forever developer plan and..