Sintory의 웹 개발 블로그

1. API 키 발급 후, 재연동오늘 이슈가 있었던 Firebse의 API 키를 새로 발급 받았다.2. 삭제버튼- 어제 하지 못했던 삭제버튼을 다시 작성했다.- Checkbox 타입일 경우에는 JS 가 독립적으로 인식하나, Button요소는 그렇지 못하기 때문에 $().click 이런식으로 접근하면 단 하나의 버튼요소만 접근 하게 된다.- 그리하여 $(document).on('click','.deleteBtn', func (){}) 이런식으로 document에 접근해서 코드해야한다.- 실수로 삭제할 경우를 대비해서 window.confirm 이라는 것도 받았다.$(document).on('click', '.deleteBtn', async function () { // ID 가져오고 let ch..

1. 웹 프로젝트 기획: 목표 설정과 핵심 기능 정리하기 1) 프로젝트 목적과 목표 설정- TodoApp 을 만들것이다. 2) 핵심 기능 정리- 일정 추가, 수정, 삭제가 가능하게끔 할것이다.3) 간단한 화면 설계  2. 웹 프로젝트 설계: 프론트엔드, 백엔드, 데이터베이스 구조1) 프론트엔드 디자인- 3-5일 정도로 하는 간단한 프로젝트 이기 때문에, 간단하게 html, css, js + bootstrap 으로만 디자인 할 예정이다. 2) 백엔드 설계- FireBase만을 이용할 것이다.3) 데이터베이스- NonSql 이라 따로 생각하지 않겠다. 3. 구현하기1) 간단한 html 만들기  -> 추후에 꾸며줄 예정이다.2) firebase db랑 연결해주기// Firebase SDK 라이브러리 가져오기i..

1. FireBase 라이브러리 세팅2. addDocs 데이터를 추가- 먼저 데이터를 읽어오구- 그 데이터를 딕셔너리로 만들어 준 후- 딕셔너리를 addDoc로 넣어주기. await addDoc(collection(db, ""), doc)$("#id").click(async function () { let data = ${"#id"}.val() let doc = { }; await addDoc(collection(db, ""), doc)});- async와 await는 JavaScript에서 비동기 작업을 처리하기 위한 키워드. 이들은 비동기적인 코드를 보다 간결하고 동기적인 스타일로 작성할 수 있도록 도와줍니다.3. getDocs 데이터 가져오기- 가져올려면, getDocs 를 해야함.-..

- TIL 이라 일단은 간단하게 쓴 후에 내가 추후에 필요할 거 같은 부분은 따로 스킵해두어야겠다.3주차1. Warming-up- Bootstrap : 남들이 만든 HTML 코드임- jQery : 남들이 만든 코드 모음, 라이브러리. JavaScript를 더욱 쉽게 조작할 수 있음.2. togle- 보이고 안 보이고 하는 것. display:none 을 해준다고 보면 됨.3. Input 요소 추가하기- 먼저 let으로 값을 선언 후 > $('#id') 를 통해 val()를 가져온다.- 그후 let temp_html 에 넣을 html 코드를 넣어준 후- 넣고싶은 갑을 사이사이에 ${} 해주면 된다.- 마지막으로 $('#id').append() 해주면 추가 된다.function makeCard() { ..

1. 웹의 동작 개념1. 클라이언트(브라우저)는 주소를 통해 API로 요청을 보내고, 서버에게 받은 HTML(데이터) 파일을 그려주는 역할을 함.2. 요청은 API라는 창구에 보냄. (정해진 약속대로 요청을 보내는 것) ex: 주소창에 주소를 입력하고 엔터를 입력3. 서버는 API 요청에 맞는 HTML 파일을 클라이언트에게 돌려줌.2. HTML- html 은 크게 사이에 아래를 넣으면 끝- Query에서는 해당 함수 정의와 사용 방식이 변하지 않으며, jQuery의 이벤트 핸들러나 다른 기능 안에서 JavaScript 함수를 사용할 수 있습니다.document.getElementById('hello').innerHTML = '안녕';위에 코드를 아래처럼 쓸 수 있다.$('#hello').html('안녕..

1. 4주차 3 강의 실습2) 음식점의 지역과 평균 배달시간으로 Segmentation 하기.- 단계별로 찾는다. 라고 생각하면 쉽다.- 1단계 - 식당이름, 시도, avg() 평균시간만 추출- 2단계 - 평균 배달시간 별로 그분화.일단은 GROUP BY 절을 사용할때,SELECT restaurant_name, SUBSTR(addr,1,2) as sido, avg(delivery_time)From food_orders fo group by 1,2sido이라는 열을 넣을지 안 넣을지 고민했다.restaurant_name만 기준으로 그룹화됨.SUBSTR(addr,1,2) as "지역"은 SELECT 문에서 사용되지만, GROUP BY에는 포함되지 않았기 때문에 그룹의 대표값(임의의 값)이 반환됨.즉, 같은 ..

01. 3주차 3강의1) replacereplace(col,'현재값','바꿀값')- col 열의 '현재값'을 '바꿀값'으로 바꾸어달라라는 뜻2) substringsubstr(col, 시작위치, 글자수)- 여기서 시작위치는 보통의 코딩과 다르게 1부터 시작이다. (다른 코드에서는 0부터 카운트 되지만 sql은 다름)3) concatconcat('a','b','c', ...)- a와 b, c, ... 를 이어주는 함수.4) 실습실습 1) 서울 지역의 음식 타입별 평균 음식 주문 금액 구하기 (출력: 서울, 타입, 평균금액)SELECT SUBSTR(addr,1,2) as "시도", cuisine_type ,AVG(price)FROM food_orders fo WHERE addr LIKE '%서울%'GROUP ..

1. Select, From, WhereSELECT 는 데이터를 가져온다는 명령어로, 조회하는 쿼리의 시작을 의미합니다.FROM 은 가져올 데이터 테이블을 지정하는 구문으로, 데이터베이스에서 원하는 테이블을 조회합니다.where 절은 데이터 필터링을 하기 위해 사용되며, 기본 구조는 select from 다음에 나옵다.- 컬럼에 별명을 주는 두 가지 방법이 있습니다. 첫 번째 방법은 컬럼명 뒤에 공백을 두고 별명을 적는 것이고, 두 번째 방법은 'as' 키워드를 사용하여 컬럼명 뒤에 별명을 붙이는 것입니다. 별명을 짓는데에는 언어나 특수문자에 따라 형태가 달라집니다.2. Between, In, LikeSQL에서 필터링 조건을 주기 위해 BETWEEN, IN, LIKE 구문 등이 있다.BETWEEN 구문은..

len 만해도 python에서는 len() 이런식만 해도 출력이 됐고, 문자열 * 숫자 하면 숫자만큼 문자열이 더해졌는데. 자바는 그런 게 안 된다.그렇다 보니 하나 하나 함수를 찾아보아야 한다.1. 문자열 반복  reapeatreapeat는 반복이다. 파이썬에서는 문자*숫자를 하면 숫자만큼 문자열이 더해졌지만. 자바에서는 없다.그리하여 reapeat 를 이용하여 반복을 해주어야한다. for문으로 구현할 수 있지만!for문보다는 함수가 간지나잖아요 ^ㅡ^char character = '-'; // 곱하고 싶은 문자int times = 4; // 반복 횟수// char을 String으로 변환하고 repeat 사용String result = String.valueOf(character).repeat(time..

1. JAVA / ( Part 01. Hello World! | java handbook)0) 언어의 역사- 컴퓨터와 소통하기 위해 기계 명령어와 일상 용어를 일대일로 매칭하는 기계어와 니모닉의 매칭 코드표를 만듦.- 이를 우리는 '어셈블리'라고 얘기함.- 어셈블리어가 등장하고 개발자들은 편해졌으나, 개선되어야할점이 많았음.- 어셈블리가 CPU마다 언어가 다 다르니, 배워야할 언어가 너무 많아져 버린 것임. 어셈블리어를 개발할 때는 같은 작업을 수행하는 소스 파일을 각 기계의 종류만큼 만들어야 했었음.- 그리하여 C 언어가 등장하게됨. 언어의 등장으로 이제는 소스파일을 단 하나만 만들어도 되는 시대가 됨.- C 언어는 하나의 소스파일을 각 기계어에 맞는 컴파일러로 컴파일을 하여 기계어 목적파일을 만듦. ..