여름청춘노코드 4

[bubble] 구글 로그인 후 닉네임,정보입력받기 (닉네임변경팝업 구축)

구글로그인 후 정보입력받기  처음 인덱스 페이지에서는 소셜로그인으로만 로그인 할 수 있도록 설정. 소셜로그인으로 정보를 받으면 이메일 외에는 다른 정보를 입력받기 쉽지않다. 하여 첫 로그인시에는 바로 닉네임 변경 팝업으로 넘어가게 설정했다.  구글 로그인 버튼 workflow 설정  Step1 - 구글로그인Action 생성 : Account > Signup/login with a social networkSignup/login with Google -> OAuth provider : Google (구글 로그인 설정은 이전 글 참고 )   Step2 - NickName 없으면(첫 로그인이라면) Nickname 변경 페이지로 이동Action 생성 : Navigation > Go to pageDestinati..

카테고리 없음 2024.08.03

[bubble] sign in 소셜로그인 페이지 만들기 (구글로그인/카카오톡으로 시작하기)

각 버튼별 정책 및 다운로드 가능   1. 구글https://developers.google.com/identity/branding-guidelines?hl=ko 로그인 브랜드 가이드라인  |  Google ID 플랫폼  |  Google for Developers로그인 브랜드 가이드라인 컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요. 모바일 또는 웹 앱에서 기본적인 profile 또는 email 범위로 Google 로그인을 사용하고developers.google.com 구글 로그인 bubble docshttps://manual.bubble.io/help-guides/data/user-accounts/authentication-plugins/google-plugin 구글 로..

[bubble] 반응형 엔진을 사용한 모바일용 구축 (responsive engine)

Bubble 반응형 엔진이란 2022년에 도입된 기능으로 기종의 화면의 크기와 해상도에 맞게 레이아웃과 콘텐츠를 자동으로 조정해주는 기능이다.  반응형 디자인의 중요성 (The Importance of Responsive Design) 1. 광범위한 사용자 수용모든 장치에서 엑세스가 가능하여 앱의 사용성을 높일 수 있다.  2. 개발 시간 단축 해상도에 맞게 개발할 필요가 없으므로 개발 시간이 단축된다.  3. 검색 상위노출검색 엔진은 모든 장치에서 액세스할 수 있는 페이지를 선호하므로 페이지 순위를 높일 수 있다.   IOS 기종별 화면 사이즈 ( Display properties of every iPhone )  https://www.ios-resolution.com/ iOS Resolution //..

[bubble] 새로운 페이지 생성 & 헤더에 로그인버튼 넣기

새로운 페이지 생성 왼쪽 최상단의 Page 클릭 -> Add a new page 클릭    기존에 만들어둔 페이지의 형식을 그대로 복사하려면 clone from 에서 선택 !   Layout 변경하기 처음 페이지를 생성하면 Layout Container layout이 Fixed로 지정되어있다.   이걸 Column으로 변경 ! (앱 환경에 적합한 Layout)   Layout의 차이점 알아보기  Column (열) : 블럭들이 세로로 정렬되는 것  보통 어플리케이션은 이렇게 세로로 정렬되면서 스크롤로 내리면서 이용하기 때문에 Column으로 Layout을 변경해 주어야 한다.          Low (행) : 블럭들이 가로로 정렬되는 것          헤더생성헤더 같이 자주 쓰이는 것들은 compone..