heyday2024 님의 블로그

서버 --> 클라이언트 : JSON 데이터를 받음(text 데이터를 긁어오는 방식) 클라이언트 --> 서버: GET 요청API: Application Programming Interface, 어떤 응용 프로그램에서 데이터를 주고 받기 위한 방법.  API 유형REST API (Representational State Transfer): HTTP를 사용해 자원(Resource)을 CRUD (Create, Read, Update, Delete) 방식으로 처리.SOAP API (Simple Object Access Protocol): XML을 기반으로 한 메시징 프로토콜을 사용해 데이터 교환을 처리.GraphQL: Facebook에서 만든 쿼리 언어로, 클라이언트가 원하는 데이터 구조를 정확히 정의해 서버에서..

복습:  jQuery는 JS를 더 쉽게 조작할 수 있게 남이 만들어 놓은 코드 모음, 라이브러리. fetch? 인터넷을 통해 데이터를 요청하고 받아오는 과정!(fetch는 짧은 코드로 데이터를 가져올 수 있음.) function openClose() { $("#postingBox").toggle(); }요소의 id가 postingBox이고 특정버튼을 클릭했을때 해당 요소를 display="none"시키고 싶음.이를 위해 jQuery toggle 매소드 이용함.  https://api.jquery.com/toggle/ .toggle() | jQuery API DocumentationDescription: Display or hide the matched elements. No..

브라우저에 동적인 기능을 추가하기 위해 Javascript를 씀!  1) let으로 변수(와 해당하는 값) 선언, 두개에 다른 문자열 더하면 하나의 문장으로 생성 가능.  2) 리스트 [], 딕셔너리 {}let a = ['사과', '배', '수박'];console.log(a[0]);let person = {'name':'bob', 'age':30, 'height':180};let name = person['name'];console.log(name); //bob  3) 반복문(리스트와 주로 같이 쓰임), 조건문let age = 15;if(age let ages = [1,2,3,4,5,6];ages.forEach(el => {console.log(el)});  4) 함수function hey(){alert..

오늘은 Bootstrap으로 netflix가 아닌 jiflix를 만들어봤다 ㅋㅋㅋㅋ 우선 bootstrap을 사용하기 위해 아래와 같은 코드를 헤드안에 삽입했고,  구글 폰츠에서 Gowun Dodum 폰트를 이용했다.@import url("https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap");* {font-family: "Gowun Dodum", sans-serif;} 부트스트랩에서 cards, jumbotron, buttons, floating labels 등을 검색하고 적절한 스타일을 선택했다. 그 후 각각 해당되는 코드를 가져와서 조금씩 수정함으로서 웹페이지를 만들어보았다. 굉장히 사용하기 간편했고, 웹페이지 또한 보기 좋은(..

Google fonts 사용해서 원하는 폰트 스타일 입히기.https://fonts.google.com/?preview.layout=grid Browse Fonts - Google FontsMaking the web more beautiful, fast, and open through great typographyfonts.google.com  html 내부 코드에 css 코드 작성할 때 style 태그 이용.Google font에서 제공하는 @import ... 코드를 style 태그 안에 넣어주고, css에서 *는 모든 요소에 적용한다는 의미.* {안에 구글 폰트에서 제공하는 font-family 코드} 이용해서 모든 font에 스타일 적용. Bootstrap: 오픈 소스 프론트엔드 프레임워크로, 글..

프론트엔드(frontend): 사용자가 보는 부분을 만드는 영역 (클라이언트)UI 구현동적 웹 기능 구현API 요청 및 데이터 처리사용자 경험 개선  백엔드(backend): 사용자가 봐야할 부분을 제공해주는 영역. (서버/데이터)웹 서버 로직 구현API 구현 및 데이터 반환DB 구축 [API(Application Programming Interface)를 활용해서 클라이언트와 서버는 서로 데이터를 주고 받음. ] HTML, CSS, JS로 화면을 만드는데, 이 서비스가 커질수록 느려지고 복잡해진다. 그래서 더 빠르고 효율적인 기술을 활용하기 위해 사용하는 자바스크립트 라이브러리 중에 하나가 React 이다. 웹개발을 위해 발전된 프론트엔드 기술들1세대: HTML/CSS, JS, DOM, Event  |..

프로그램이란? 사용자가 컴퓨터에게 일을 시킬 때 (명령할 때),  정해진 순서대로 일을 하는 것.(ex) 엑셀, 파워포인트... 사람이 사용하는 언어가 따로 있듯이, 컴퓨터도 컴퓨터가 해석하고 처리할 수 있는 언어가 따로 있다. 컴퓨터가 사용하는 언어인 기계어는 이진 숫자로  구성되어 있다. 인간의 입장에서는 이런 이진 숫자로 이루어진 기계어는 상당히 난해😵😵하기 때문에, 조금 더 개발자들이 프로그래밍을 쉽게 그리고 편리하게 할 수 있도록 만들어주는 언어가 존재한다. 바로 Java, Python, C++ 등의 우리가 흔히 알고 있는 프로그래밍 언어 (high level programming language) 이다.(참고로, 우리가 외국인들과 대화할 때 외국어를 번역하기 위해 번역기를 쓰듯이, high..

스파르타 내일배움캠프의 사전 캠프가 시작되었다!약 한달간 진행되는 사전캠프는 앞으로 있을 9 to 9 훈련에 준비하기 위한 훈련관정을 제공한다. 진행될 모든 수업 과정에 열심히 참여해서 성실하고 소통을 잘하는 프론트엔드 개발자로 성장하기 원한다.화이팅!!!!!!!!!  - 귀여운 르탄씨와 한 컷!