티스토리

코딩일지

검색하기

블로그 홈

코딩일지

anytingbetter.tistory.com/m

코딩 배우는 과정을 기록하는 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

위코드 2차 프로젝트 회고록 2차 프로젝트 기간 : 10월 31일 ~ 11월 11일 클론코딩 사이트 : 크림 팀명 : KRWEAM 개발인원 : 프론트엔드 3명 (김민경 박성수 윤수), 백엔드 2명 (김택수 이찬우) 맡은 부분 : 상세페이지 nav footer 레이아웃 구현 한 것 : 모달창, nivo를 사용한 그래프 깃허브주소 GitHub - KMK99cone/38-2nd-KRWEAM-frontend: 김민경,박성수,윤수 김민경,박성수,윤수. Contribute to KMK99cone/38-2nd-KRWEAM-frontend development by creating an account on GitHub. github.com 시연연상 후기 나에겐 이번 프로젝트도 배울게 많았었다. 첫번째로 좀더 적극적이였으면 좋았을것같았다. 너무 다.. 공감수 0 댓글수 1 2022. 11. 13.
AWS intro 아마존 클라우드플랫폼 1.운영서버 :Production Server (실사용자 서비스) 운영서버의 아키텍쳐 1.단일서버 사용자 -> server(application+DataBase) 가장 간단한 서버구조 전체 서비스의 장애 발생 가능성 높음 서버자원을 효율적으로 사용하기 어려움 보안성이 떨어짐 서버의 수를 여러개로 늘리는 확장방식이 어려움 (수평적확장) server(aplication ----dataBase) 단일서버구조에서 aplication DB를 각각의 서버로 구성 단일서버구조의 단점을 어느정도 해소 하나의 서버가 아닌 두개 서버 관리 -> 구성복잡 aplication DB사이의 지연시간과 네트워크 보안고려 수평적 확장은 여전히 어려움 3.서버단위의 로드 밸런서 구조 사용자 -> local bal.. 공감수 2 댓글수 0 2022. 10. 23.
HTTP HTTP HT hyper text 문서와 문서가 링크로 연결이 되어있음을 의미 T transfer 웹페이지 문서 보냄 P protocol 파일 주고받는 양식/방법 특징 요청/응답 stateless 과거 http 통신의 결과(상태)보존xx stateful - 응답 축적 요청 statelss stateful A— A A B— B A+B C— C A+B+C —>그래서 토큰이 나옴 request 메세지 구조 start line -요청의 첫번째 줄(제목) 1. HTTP method - 요청이 의도한 액션을 정의 2. Request targer - 요청이 전송되는 목표 url 3. HTTP version - http버전 Headers -요청의 메타데이터를 담고 있는 부분 1. {key:value} 2. Header.. 공감수 2 댓글수 0 2022. 10. 23.
wecode 4주차 인증&인가 인증&인가 회원가입 - 암호화해서 데이터 저장 로그인 절차 - 입력한 비밀번호를 암호화해서 저장된 데이터와 비교 매 세션마다 로그인할수는 없으니 stateul상태를 유지하기 위해서 session cookie toekn 같은 기술 사용 session - 클라이언트가 브라우저를 통해 웹서버에 접속하는 시점으로부터 브라우저를 종료해 연결을 끝내는 시점 동안 클라이언트와 웹서버가 논리적으로 연결된 상태 서버는 세션 정보를 저장, 클라이언트에게는 세션을 구분할 수 있는 세션 id 부여 클라이언트 request 보낼때 세션 id를 보내 클라이언트 상태 확인 쿠키 - 로그인 유지x 장바구니 넣기 가넝 ,이전 기록 상태정보를 담아놓음 인증 flow 사용자의 인증과정 요청 인증 완료시 세션 정보를 서버 메모리에 저장 해.. 공감수 0 댓글수 0 2022. 10. 17.
css 레이아웃의 모든 것.Assignment 1. position 속성 - relative, absolute, fixed - css에서 position속성은 html 문서 상에서 요소가 배치되는 방식을 결정한다. 많은 경우, position 속성은 요소의 정확한 위치 지정을 위해서 top,left,bottom,right 속성 과 함께 사용된다. -relative로 설정 시 요소를 원래 위치에서 벗어나게 배치 할 수 있게 된다. 요소를 원래 위치를 기준으로 '상대적'으로 배치한다고 하면 된다. 요소의 위치지정은 위의 top 등의 속성을 이용한다. -absolute는 position 속성값 중 가장 난해하고 주의해서 사용해야 한다. 이는 relative와 정반대 개념이라고 오해하는 것때문인데, ablsolute 속성값은 relative 속성값과 같이 .. 공감수 0 댓글수 0 2022. 9. 21.
Semantic Web, Semantic Tags Semantic Web은 '의미론적인 웹'이라는 뜻으로,현재의 인터넷과 같은 분산환경에서 리소스(웹 문서, 각종 화일, 서비스 등)에 대한 정보와 자원 사이의 관계-의미 정보(Semanteme)를 기계(컴퓨터)가 처리할 수 있는 온톨로지 형태로 표현하고, 이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다 Semantic Tags는 div나 span과 같이 의미가 없는 태그는 태그 이름만 보고는 어떤 내용인지 전혀 유추할 수가 없는 반면, form, table, article 등 의미가 있는 태그로써 내용을 명확하게 정의하는 태그이다. html에서 이미지를 표현하는 방법은 두가지가 있다. 1. img태그로 넣기 2. div태그로 background 속성으로 넣기 { backgroun.. 공감수 0 댓글수 0 2022. 9. 20.
DNS (Domain Name System) DNS 란 도메인 네임 시스템의 약자로 IP 네트워크에서 사용하는 시스템이다. 스마트폰이나 노트북부터 대규모 웹사이트의 콘텐츠를 서비스 하는 서버에 이르기까지 인터넷상의 모든 컴퓨터는 숫자를 사용하여 서로를 찾고 통신한다. 이 숫자를 ip주소라고 한다. 웹 브라우저를 열고 웹 사이트로 이동시 우리가 입력하는 주소창, 이를테면 naver.com 같은 것은 도메인 이라고 한다. 이 둘을 연결해 주는 것이 DNS이다. DNS를 사용해 우리는 ip주소를 입력하지 않고 좀더 직관적으로 사용할 수 있는 도메인 이름으로 웹사이트를 갈 수 있다. 인터넷 상의 DNS 시스템은 이름과 숫자 간의 매핑을 관리하여 마치 전화번호부와 같은 기능을 한다. DNS 서버는 이름을 ip주소로 변환하여 도메인 이름을 웹브라우저에 입력할.. 공감수 1 댓글수 1 2022. 9. 9.
자기소개 페이지 구성 소개 내 자기소개 페이지에서 소개할 내용은 css이다. 아무래도 내 자기소개 페이지에서 제일 어려운 부분은 거기 밖에 없기 때문이거 같기 때문이다. html{ background-color:#FFF5EE;} span { border:3px solid brown ; text-transform: uppercase; color:black; background-color:#FFDAB9; font-size:30px;} h1 { border:3px solid brown; color:red; paddingcolor:brown; margin:90px; margin-color:brown; background-color:#FFDAB9; text-align:center; font-size:100px;} h2{ font-size:.. 공감수 0 댓글수 0 2022. 8. 28.
위코드 사전스터디 3주차 일요일 for문 간단정리 for (초기상태;조건;변화){ 수행할 동작 } 초기상태 : let i=0; 이렇게 적용 조건 : 범위설정 index 증가시 특정숫자 미만/이하로 설정 감소시 0 이상으로 설정 변화 : i++/i--- = ++1/--1 (기본) i+=n / i-=n ex) for (let i=0; i 공감수 0 댓글수 1 2022. 8. 28.
위코드 사전스터디 3주차 마무리 배열이 필요한 이유와 선언하는 방법 -필요한 이유 하나의 배열 내에 여러 자료형의 데이터를 담을수 있다. 하나의 변수에 여러 데이터를 관리할 수 있기 때문에, 코드의 가독성이 높아지고, 변수의 수를 줄여주고, 연산에 편리하다. 관련성 있는 데이터를 함께 변수에 저장하므로 데이터를 찾는데 용이하다. -선언 [대괄호]를 사용한 리터럴 방식 let Array=[1,2,3]; 리터럴 방식으로 배열값들을 변수 선언과 동시에 함꼐 선언하여 사용하는 방법 let Array=A[1,2,3]; 배열의 값을 추가, 수정, 삭제하는 방법 요소 수정 : Array[배열 n번째 값]; 요소 추가 : Array.push(추가할 값); 요소 삭제 : Array.shift() - 첫번째 요소 삭제 .pop () - 두번째 요소 삭제.. 공감수 0 댓글수 0 2022. 8. 27.
위코드 사전스터디 3주차 화요일 확실히 오늘 하는건 어려웠다.... 오늘 것 정리하기 Array -배열요소 접근 let array = [50,60,70]; array[0]; ->50 -다차원요소 let array=[[1,2,3],[4,5,6],[[7,8,9],10,11] let myarray=array[2][0][1] ->8 [0][0[ ->1 slice(start,end) let A =[1,2,3,4,5,6,7,8] let B=A.slice(2,6) -> [3,4,5,6] splice(start,delete,추가하고싶은요소) filter let A = ['apple','banana','grapes'] let B = A.filter((a)=>a.includes('ap')) -> ['apple','grapes'] 다차원 filter((a.. 공감수 0 댓글수 0 2022. 8. 23.
위코드 사전스터디 3주차 월요일 사실 지금 하고 있는게 이해가 안된다. 이해하면서 푸는게 아니라 그냥 푸는느낌... 이게 약간 절정느낌 그래서 여기서 막혀벌임ㅎㅎ.. 공감수 0 댓글수 0 2022. 8. 22.
위코드 사전스터디 2주차 마무리 변수가 필요한 이유와 선언하는 방법 변수가 필요한 이유 : 프로그램에서 가독성을 높여주고 유지보수에 좋다. 복잡한 코드를 변수 안에 저장하면, 필요할때 변수를 불러서 데이터 값을 불러낼수있다. 선언하는 방법 : 변수의 선언은 var const let 키워드로 할수 있다. 예를 들면 let name; console.log(name); 자바스크립트 데이터 타입의 종류 원시타입 : 원시타입의 값은 변경 불가능한 값 (immutable value)이며 pass-by-value (값에 의한 전달) 이다 Number(숫자열) String(문자열) Boolean(true/false) null(값없음을 의도적으로 나타낼때) undefined(어떤 변수를 만들고 그 값을 정의하지 않았을때) symbol (이름의 충돌 위.. 공감수 0 댓글수 0 2022. 8. 19.
위코드 사전스터디 2주차 금요일 -변수 n개 합치기 console.log("제 나이는 ", myAge, "살입니다") -변수 지정해서 출력 let myName = 'JavaScript'; console.log(myName) let a="hello"; let b=" world, "; let c=2021; console.log(a+b+c) -null & undefined let name1; // undefined let name2 = null; // null console.log(null == undefined); // true console.log(null === undefined); // false (엄격일치연산(===)는 value뿐만 아니라 type도 같아야 true가 나옵니다) console.log(typeof null); // .. 공감수 0 댓글수 0 2022. 8. 19.
위코드 사전스터디 간단정리 ~2주차. css ~ : css A : a { color : red; (효과) } (선택자) C : html 속성 밑줄 없애기 - text-decoration : none; css 속성 알아보기 css x x property -우선순위 : #~ .~ a~ -#:id="active" 재사용 -style.css -A.html 공감수 0 댓글수 0 2022. 8. 19.
위코드 사전스터디 간단정리 ~2주차. HTML TAG - - - - 상단 '탭' - 내용 -A : ~로 연결 -B : _blank (새창으로 열기) _self (현재탭에서 열기) - -A : 경로. 같은폴더내 이미지이름 or 다른폴더시 ~폴더1/폴더2/이미지이름 ~ 형광줄 -> 1.2.3.... -> -.-.-.... 줄바꾸기 - -A : text submit checkbox -B : (주석넣기) -레이아웃 ->웹사이트 머리글 (영역정의) (본문 영역) (사이드바) 공감수 0 댓글수 0 2022. 8. 19.
위코드 사전스터디 2주차 화요일 자바스크립트 function이 되게 어렵다. return의 활용도 잘 모르겠고 과제를 진행하는데도 어려움이 있었다. 그리고 과제의 모범답안을 복붙했는데 에러가 떠서 더 이상했다. 음... 내가 생각하는게 맞는게 아닐까 공감수 0 댓글수 0 2022. 8. 18.
위코드 사전스터디 1주차 마무리 HTML, CSS란 무엇이며 필요한 이유 html 은 웹 문서를 만들기 위한 기본 언어 중에 하나이다. css 는 문서의 표시 방법을 설명해주는 스타일 시트언어로 서버가 아닌 웹 브라우저에서 해석되어 화면에 적용되기 때문에 웹 서버의 부담을 줄여주면서도 다양한 기능을 수행할 수 있다. html은 웹문서의 기둥과 뼈대가 되는 언어이고 css는 내부를 좀더 손실없이 쉽게 다듬어주는 언어이다. HTML, CSS, JavaScript의 관계 html과 css로 뼈대와 내부를 다듬고 js로 내부 디자인을 하게 된다. .html, .css, .js세 종류의 파일을 연결하는 방법 html의 기본을 작성하고 css로 스타일 시트를 하나 생성해서 html 내부에 연결한다. link rel="stylesheet" href.. 공감수 0 댓글수 0 2022. 8. 15.
위코드 사전스터디 1주일차 8월 11일 목요일, 사전스터디를 통지받고 나름 건드린지 1주일이 되었다. 실은 저번주가 OT라서 저번주 월요일부터 시작이였는데 엄마랑 이모랑 싱가포르 갔다와서 늦었다. 싱가포르에서 사전스터디 OT 메일을 본 나.... 눈물 줄줄쓰.... 화요일에 사전스터디를 했다. 나는 저번주부터가 1주일인줄알고 토요일 일요일동안 생활코딩 html, css편을 보았다. 확실히 인강은 완주하기 힘들다는걸 다시금 깨달았다. 첫번째 봤을때는 따라하기만 급급했는데 아무래도 두번째로 모르겠는 내용만 쏙쏙 보니까 그나마 알것같았다. 어쨌든 오늘은 대강의 틀을 짜놨다. 당장 내일이 사전스터디 발표날이라 여기서 많이 진행되긴 어려워보이지만 그래도 깔끔은 하게 해놨으니 괜찮지 않을까... 이제 구글링을 좀 해서 사람들이 어떻게 했는지.. 공감수 0 댓글수 0 2022. 8. 11.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.