기획자의 하드스킬모음 13

노코드(Bubble 버블)로 어플 만들기: 로그인 validation

😂 나름의 진로에 대한 방황 및 노잼시기를 겪다가 돌아왔습니다.이제는 확고해졌으니 다시 블로그를 포스팅 해보겠습니다! 회원가입 validation(유효성 검사)란?기본적으로 회원가입을 위해서 필요한 이메일, 비밀번호에는 이 값이 유효한지를 검증하는 "validation"이 필요합니다.예를 들어 이메일을 입력했을 때, 기존에 가입된 이메일인지 확인하거나 비밀번호는 대소문자,특수문자,숫자가 포함된 8-15자리 문자열인지 확인하는  등이 이러한 유효성 검사에 해당합니다.그래서 오늘은 기본적인 유효성 검사를 버블에서 어떻게 만드는지 비밀번호를 예시로 들어 차근차근 알아보겠습니다. Apperance에서 기본세팅하기 (front에서 유효성 검사)input Password 버블에서 기본적으로 제공하는 Content..

[javascript] querySelector(),querySelectorAll()

오늘은 queryselector에 대해 글을 써보려고 한다. 쿼리셀렉터는 내가 원하는 element를 html에서 가져오기 위해 사용하는데, 간혹 이런 경우가 있다. class이름을 써서 가져오고 싶은데, 여러개의 요소에 class 이름이 동일하게 들어가는 경우이다. 위처럼, show-modal이라는 class를 세 가지의 button element가 동일하게 가지고 있다면 어떻게 해야 할까? 물론 다른 id값을 부여한다던지, 개별적으로 선택할 수 있는 방법이 있긴 하다. 그러나 세 가지 요소에 모두 동일한 함수를 적용하고 싶은거라면 그건 너무 비효율적인 방법이다. 그럴때 사용하는 것이 querySelectorAll()이다. querySelectorAll()을 사용하면 동일한 클래스를 가지는 요소를 모두..

🧐 초보자 깃허브 사용법(+ 기본적인 용어설명)

오랜만에 글을 올리네요! 거두절미하고 오늘은 깃허브를 처음 다뤄보시는 분들이 참고할 만한 깃허브 사용법에 대한 글을 올리고자 합니다. 저도 깃허브를 이제 막 제대로 써보려고 해서,, 왜 깃허브를 써야 하는지 그 필요성에 대해 잘은 모르겠으나.. 깃허브를 만약 안쓴다면, 4명이 한 서비스를 위해 개발 한다고 할 때 각자의 코드를 각자의 환경에서 작성하고 하나의 파일로 합치는 과정이 필요하겠죠? 네명이 만든 전체 폴더 zip해서 단톡에 올리고, 그 중 한명이 바뀐 부분들 일일히 코드 읽어서 찾아가지고.. 한 개의 코드로 취합하는.. 정말 거지같은 상황이 벌어집니다. 잘은 모르겠지만 어쨌든 깃허브는 필수입니다. ⚠️ 용어 설명 git - 계속 추적하면서 변경내역 관리하는.. 핵심 역할. > github가 바뀐..

문과 직장인 자주 활용하는 sql 기초 문법 모음

sql('Structured Query Language')은 문과 직장인들 사이에서 되게 유명한(?).. 유명하다기보다는 다들 한번쯤은 들어보고 나도 해볼까? 하는 언어라고 알고 있다. 그래서 혹시 sql을 활용해보고 싶은데, 혹은 실무에서 활용하면 좋을 것 같은데 엄두가 안나는 사람이 있다면 이 글을 참고하면 기초적인건 알아갈 수 있을 것 같다. ❗️글을 읽기전.. * 쿼리란? 데이터를 뽑기 위해 작성한 코드라고 이해하면 됨. * 이 글에서 한국어로 쓰는부분을 여러분들이 사용할 칼럼,테이블명 등으로 바꾸면 됨 1. Select 가장 기본적인 쿼리의 구조는 "select * from 테이블이름" 이라고 보면 된다. 이 쿼리를 쉽게 풀어서 말하자면 = 테이블에서 *(전체 칼럼)을 고른다. 라는 의미이다. ..

문과 직장인 5일만에 sqld 개발자 자격증 취득하는 방법

제목이 약간 자극적인 것 같다. 그치만 사실인 걸.. 꼭 단기간에 자격증을 따서 블로그에 올려야지 했는데, 진짜 합격해버렸다. 그것도 60점 커트라인인데, 68점이라서 기분이 째진다. 거두절미 하고.. 어떻게 자격증 시험을 준비했는지 나의 기본적인 백그라운드 설명 후에 그 과정과 방법을 알려주려고 한다! 시험 치기 전 나의 background - 우선 나는 현재 인턴으로 직장 생활을 하고 있고, 10-7시까지는 일을 한다. (+ 이틀은 재택 => 이거 아니였으면 3일 불가능) - 학부생 시절에 웹 사이트 개발을 하면서, db테이블 만들고 데이터 입출력 하는용도로 거진 반개월 정도 썼었고, 데이터를 요런저런 형태로 다양하게 뽑아서 활용하고 이런건 해본 적 없다. - 회사 입사를 하면서 본격적으로 실무에서 ..

MYSQL 공부 2일차

공부를 이때까지 안한게 아니다. 블로그에 올릴 만한 내용이 없어서 그랬던 것일 뿐. 핑계아님. 어쨌든 쿼리문 중에 특정 상황에 도움 되는 쿼리문을 좀 올려보려구 한다. 테이블 구성 보고 싶을 때 SHOW TABLE STATUS; 테이블 열 이름 확인 하고 싶을때 DESCRIBE 테이블 이름; 어떤 특정 조건(숫자값일 경우) 사이에 있는 값 조회 AND 또는 BETWEEN 사용 SELECT 열이름 FROM 테이블이름 WHERE 열이름 BETWEEN 값1 AND 값2; SELECT 열이름 FROM 테이블이름 WHERE 열이름>= 값1 AND 열이름>=값2; 데이터 내용으로 값 조회 SELECT 열이름 FROM 테이블이름 WHERE 열이름 LIKE '찾고자하는문자열%'; EX. 찾고자 하는 데이터가 '김'이 ..

[패스트캠퍼스]SQL로 시작하는 데이터 분석 첫걸음 : SQL 강의 2주차 학습일지

안녕하세요! 드디어 2주차 학습일지를 작성하게 된.. just(그냥)입니다. 아직도 왜 제 블로그 이름 이걸로 지었는지 의문.. 아무튼 이번주에 배운 것들을 한번 정리해보고자 합니다!! 하도 개념이 많아서 솔직히 다 외우는 건 불가능이고,, 개발을 할 때도 기본적인 것만 외우지 모든 세세한 것들을 외우고 있진 않으니까요!! 필수적으로 알아두면 좋을 쿼리문과 함수들만 여기에 적어볼게요! 1. ORDER BY 이 쿼리문은 데이터를 정렬할 필요가 있을 때 사용하는데, 솔직히 데이터가 순서대로 예쁘게 정리되어 있는 경우는 없죠? 이럴 경우에는 엑셀에서와 마찬가지로, 보기 좋게 데이터를 나열하면 좋습니다. 물론 데이터가 어떤 기준으로 나열되는지는 데이터를 뽑는 사람이 정해야 하겠죠! 위에 사진을 보시면 attac..

[패스트캠퍼스]SQL로 시작하는 데이터 분석 첫걸음 : SQL 강의 1주차 학습일지

안녕하세요 그냥입니다! 좀 더 객관적인 수치로 서비스를 고민하는 연습이 필요하다는 생각이 들어, mysql 공부를 독학하고 싶었는데 마침 국비지원이 되는 강의들을 패스트캠퍼스에서 제공중이더라구요!! (인스타그램 같은 곳에서 비슷한 광고를 많이 봤더니 마침 제 눈에 딱! 띄었습니다^^) 국비를 지원받아서 강의 수강을 하려면, '내일배움카드' 라는 걸 발급해야 하는데 귀찮기도 하고 뭔가 뽑히는 기준이 따로 있지 않을까 해서 미뤄놓다가 호기심으로 도전하는 일에 사비를 쓰고 싶지 않아서.. 한번 신청해보았습니다! 근데 왠 걸.. 아무나 뽑아주나 봐요.. 여러분도 신청해보세요 나랏돈..어차피 세금내는거..공짜로 공부해요 무튼, 오늘은 다음에도 패스트 캠퍼스에서 강의듣고 싶어서 챌린지를 신청했기 때문에 학습일지를 ..

대학교 과제 피그마로 만들기(2)-앱화면 만들기

안녕하세요 그냥입니다.오늘은 저번 포스팅에서 보여드렸던, 제 대학교 과제를 피그마로 구현시킬 겁니다.이겁니다. 앱 첫 화면은 어플의 로고만 제 아이템은 자취를 하는 밀레니얼 세대들에게, 혼자 요리를 쉽게 할 수 있는 거였습니다.따라서 "혼자서도 쿡쿡쿡"이라는 어플 이름을 만들어봤습니다.저는 어도비를 쓸 줄 몰라서, 아이패드로 어플 로고를 그렸습니다.피그마에서 place image-layer-multiply 해서 로고를 넣어줍니다.두번째 화면은, 기본 정보 입력받기 제 아이템에서는, 사용자가 기본적으로 가지고 있는 요리환경이 어떠한지 정보를 입력받아야 합니다. 따라서 식재료,조리도구,시간과 비용에 관한 정보를 입력받도록 했습니다.rectangle을 삽입하고, 직사각형을 둥그렇게 깎았습니다. (화면을 확대해..

대학교 과제 피그마로 만들기(1)-피그마 단축키 알아보기

안녕하세요 그냥입니다.뭔가 오랜만인 것 같네요..요즘 공모전 준비로 너무 바쁩니다. 그래서 오늘은 공모전에 유용한 피그마를 다시 들고왔습니다.제가 너무 많이 말해서, 지겨우시죠.저도 지겹습니다.ㅎ 그러나 할줄 아는게 없어서,, 이 프로그램이 근데 진짜 유용해서..그럽니다. 오늘은 본격적으로 만들기 전 피그마 주 사용키를 알려드릴겁니다. ctrl+shift+/ 이렇게 누르면, 아래쪽에 단축키가 뜹니다.저는 단축키를 잘 사용하지 않기 때문에 참고하세요!! 1. 이미지 배경색이랑 동일하게 만들기->이미지를 삽입하게 되면, 그 이미지의 배경색과 어플의 색을 동일하게 만들어야 하는데요.->그럴땐 우측 상단 layer-multiply를 눌러줍니다.2. 두개의 개체들을 한 그룹으로 묶기 -> 화면을 만들다보면, 계속..

728x90