전체 글14 노코드 툴 버블(bubble.io) 회원가입 한 번에 끝내기! 노코드 툴 버블(bubble.io) 같은 경우 영어로 되어 있어 많은 분들이 학습에 어려움을 겪고 있습니다. 한국어 강의가 굉장히 부족하기 때문에 더 어렵게 느껴지기도 하는데요. 버블(bubble.io)에서 회원 가입하는 방법은 그렇게 어렵지 않습니다. 특히 구글 아이디를 활용한다면 더욱이 쉽게 해결할 수 있습니다. 1. 버블(bubble.io) 메인화면 노코드 툴 버블 홈페이지에 들어가게 되면 메인 화면을 볼 수 있습니다. 이곳에서 우측 상단에 보이는 Get Started를 클릭하게 되면 회원가입 페이지로 들어갈 수 있습니다. 영어라고 해서 당황할 필요가 없습니다. 2. 회원 가입 폼 작성 다음으로 진행할 것은 회원가입 폼을 작성하는 것입니다. 처음 설명드린바와 같이 구글 아이콘이 있는 Log in w.. 2023. 1. 20. 노코드 툴 버블 UI Builder 마스터하기! UI Builder는 디자인을 하는 공간입니다. 사실 버블을 이용해 서비스를 개발하다 보면 가장 쉽게 익숙해지는 공간이기도 합니다. 때문에 기능에 대한 자세한 설명보다는 사용 방법에 대한 설명을 위주로 진행을 하도록 하겠습니다. 자, 그럼 Visual elements를 먼저 살펴볼까요? 1. 텍스트(TEXT) 첫 번째는 텍스트입니다. 텍스트는 서비스를 개발하는 개발자가 직접 써서 보여줄 수도 있고, 데이터 베이스 저장된 텍스트를 불러와 보여줄 수 있는 기능을 담당하는 요소입니다. 사용자에게 텍스트를 보여주고 싶다면 Text를 기억하세요! 보이시나요? 텍스트 요소를 이용해서 사용자에게 보여주고 싶은 문장을 입력해 보세요! 그리고 우측 상단에 있는 Preview를 누르게 되면 입력한 문장이 그대로 보이는 걸.. 2022. 12. 20. 버블(Bubble.io) 학습 전 기본 구조 살펴보기! 버블(Bubble.io) 기본 구조 본격적인 버블 강의를 진행하기에 앞서 우리가 알아야 할 것은 버블의 기본 구조이다. 버블은 주요 기능이 정리되어 있는 탭(1)과 각 탭의 기능을 사용할 수 있는 하위 탭(2)으로나누어져있고, 각 기능을 시각화 할 수 있는 페이지(3)로 구성되어 있다. 디자인 탭 디자인 탭에는 페이지를 디자인할 수 있는 요소들이 들어 있는데, 크게 5가지로 구성되어 있다. 첫 번째는 Visual elements다. Visual elements는 화면에 표시되는 모든 요소들이 모여 있는 곳이며, 보여지는 화면을 꾸밀 사용하는 모든 요소라고 생각하면 쉽다. 두 번째는 Containers이다. Containers는 모든 elememnts를 담아내는 그릇이라 할 수 있다. 하나의 요소가 아닌 .. 2022. 12. 19. 웹사이트 빌더 웹플로우(Webflow)와 소프터(Softr) 주요 기능 비교 바야흐로 노코드 시대가 되었다. 노코드가 가야 할 길은 멀지만, 노코드에 대한 관심을 갈수록 뜨거워지고 있다. 노코드가 주목을 받는 이유 중에 하나는 제품 개발과 자동화를 코드 한 줄 쓰지 않고 개발하고 구현할 수 있기 때문이다. 노코드 툴은 크게 두 가지로 나뉜다. 하나는 웹을 기반으로 하고, 다른 하나는 모바일 앱을 기반으로 하는 것이다. 노코드가 유행을 하기 시작하면서 다양한 서비스가 출시되고 있는데, 그중에서도 가장 많이 사용하는 서비스를 위주로 소개를 하려 한다. 오늘 소개할 노코드 툴은 웹 사이트 빌더인 웹플로우(Webflow)와 소프터(Softr)이다. 1. 웹플로우(Webflow) 주요 기능 웹플로우 같은 경우 웹 사이트 중에서는 가장 자유도가 높은 툴 중에 하나다. PC 비롯해서 태블릿과.. 2022. 12. 7. 노코드 툴로 개인 강의 사이트 만들기 3탄 결제 기능 지난 시간까지 자신만의 강의를 올리고, 검색할 수 있는 기능까지 구현을 해보았다. 이제는 유저들이 강의를 볼 수 있는 페이지를 구축하고, 가장 중요한 결제 기능을 만들어 줘야 하는 시간이다. 사실 텍스트로만 표현하기에는 여러모로 아쉬운 점이 있다. 해당 포스팅에서 참고할 점은 워크플로우를 어떻게 설정하는지, 우리가 설정한 데이터 베이스가 어떻게 활용되는지를 위주로 살펴보면 좋을 것 같다. 1. 콘텐츠 리스트 강의 콘텐츠를 제작해서 업로드했으니, 이제 남은 것은 유저들이 시청할 수 있는 페이지를 만들어 주는 것이다. 먼저 데이터를 쉽게 불러올 수 있도록 "Type of coneten"를 "Course"로 설정해 준다. 이렇게 되면 워크플로우에서 해당 이벤트 데이터를 쉽게 불러올 수 있다. 다음으로 설정해 .. 2022. 12. 1. 노코드(No Code)로 개인 강의 사이트 만들기 2탄 개인 강의 사이트 만들기 1탄에서는 데이터 베이스를 설계하고, 새로운 강의를 업로드하는 기능을 집중적으로 알아보았다. 2탄에서는 강의 검색 기능을 포함해서 검색한 강의를 불러오는 기능을 집중적으로 다뤄볼 예정이다. 이는 쇼핑몰에서 상품을 검색하는 기능과 비슷하니 참고하면 좋을 것 같다. 1. 검색 내비게이션 만들기 강의 사이트의 기본이라고 할 수 있는 검색 기능을 구현하기 위해서는 새로운 워크 플로우를 만들어 줘야 한다. 이번에 만들어질 워크플로우는 유저의 검색 쿼리를 처리하기 위하 과정이다. 워크플로우에 들어왔다면 Navigation에서 "Open an external website" 이벤트를 생성해 준다. "Open an external website" 를 사용하는 이유는 외부 웹 사이트를 열도록 선.. 2022. 11. 24. 버블(bubble.io)로 개인 강의 사이트 만들기 1탄 1인 창업자가 많아지면서 개인 강의 사이트를 제작하려는 분들이 많아지고 있다. 물론 라이브 클래스를 비롯해서 개인 강의 사이트를 제작할 수 있는 서비스가 있지만, 지속적으로 나가는 고정비용과 수수료는 1인 창업자 입장에선 부담스러울 수밖에 없다. 이와 같은 문제는 노코드 툴인 버블로 쉽게 해결이 가능하다. 복잡한 로직이 필요한 강의 사이트부터 간단한 강의사이트까지 모두 만들 수 있기 때문이다. 만약 강의 사이트 제작을 생각하고 있다면, 버블의 핵심 기능을 활용해서 제작해 보는 것도 나쁘지 않은 선택이라 생각한다. 게다가 자기 계발까지 할 수 있으니 여러모로 성장하는 계기를 만들어 줄 수 있을 것이다. 1. 데이터 베이스 설계 본격적인 강의 사이트 제작에 앞서 먼저 해야 할 것은 데이터 베이스를 설계하는 .. 2022. 11. 23. 기획자가 노코드를 배워야 하는 이유 깃허브 CEO인 Chirs Wanstrath는 "코딩의 미래는 코딩이 아니다"라는 말을 했다. 코드를 저장하고 관리하는 깃허브 서비스를 운영하는 CEO가 한 말이어서 더 신선한 충격을 주는 문장이다. 깃허브 CEO는 결국 코드를 전혀 작성할 필요가 없는 제로코드(Zero code) 시대가 올 것이라고 예측했다. 그리고 이 말은 예측이 아니라 현실이 되었다. 요즘에는 말로만 코딩을 할 수 있는 시대가 도래했다고 하여 "입 코딩"이라는 말이 농담처럼 사용되고 있다. 그렇다면 미래 개발자를 꿈꾸며 코딩을 배우고 있는 사람은 어떤 스탠스를 취해야 하는 걸까? 그리고 개발자는 아니지만 코딩을 배워서 서비스를 개발하고 싶은 사람은 어떤 공부를 해야 할까? 개인적으로 이와 같은 고민으로 코딩과 노코드를 공부하며 깨달.. 2022. 11. 22. 이전 1 2 다음