⚡ Ajax가 뭘까? Ajax란 Asynchronous Javascript and Xml의 약자입니다. 이는 자바스크립트의 라이브러리 중 하나이며, 브라우저가 가지고 있는 객체를 이용하여, 전체 페이지를 새로고침 하지 않고, 페이지의 일부분만 로드하는 기법입니다. 즉, 자바스크립트를 통해서 서버에 데이터를 비동기 방식으로 요청하는 것입니다. ⚡ 비동기 방식이란? 비동기 방식은 웹페이지 전체를 리로드 하지 않고, 필요한 부분만 데이터를 불러오는 방식입니다. ⚡ 그렇다면 왜 Ajax를 쓸까요? 단순하게 웹에서 데이터를 조회하고 싶은 경우, 페이지 전체를 새로고침 하지 않기 위해서 json이나 xml등의 형태로 필요한 데이터만 받아 갱신하기 때문에 자원과 시간을 절약 할 수 있음 ⚡ Ajax의 장 / 단점 ❗..
⚡ REST 가 뭘까..? REST는 Representational State Transfer의 약자이다. 각 단어의 뜻을 풀어보면, Representational => 표현, 묘사 State => 상태 Transfer => 전송 즉, (웹 어플리케이션의) 어떠한 상태(정보)를 전송하는 표현방식이라고 할 수 있다. ❗️ REST를 한마디로 정의하면 HTTP라는 프로토콜(규약, 규칙)을 이용하여, Web에서 제공하는 모든 자원들을 하나하나 가르킬수 있는 고유한 주소(URI)를 이용하여 HTTP Method를 통해 작업(CRUD)을 하는 방식을 말한다. Web에서의 통신 = HTTP 프로토콜을 이용한 통신 클라이언트의 웹브라우저에서 주소(URI)를 입력 웹브라우저가 주소를 이용해 HTTP request 메세..
⚡️ 데일리 코딩은 어떻게 진행해볼까? 현재 진행중인 코드스테이츠 45기에서 알고리즘/자료구조와 관련된 학습을 위해 스터디에 가입하였다. 스터디의 목적은 코딩테스트 문제 풀이 및 공유이다. 코딩테스트 문제풀이 플랫폼은 프로그래머스로 결정하였으며, 매 스터디 전 학습할 코딩테스트 문제를 정하여 풀고, 각자의 코드를 발표하며 리뷰하는 형식으로 진행 문제 풀이를 공유하는 방식은 GitHub Organization을 생성한 후 Pull Request 기능 활용 https://github.com/WONHO22/Alpago
⚡️ Counter 만들어 보기 +, - 버튼 생성 후 + 버튼을 누를 시 +1을 -버튼을 누를 시 -1이 되도록 Counter 컴포넌트 구현해보기 App.js import React from "react"; import { Routes, Route, Link } from "react-router-dom"; import Home from "./pages/Home"; import Counter from "./pages/Counter"; function App() { return ( Home / Counter ); } export default App; Counter.js import React, { useState } from "react"; const Counter = () => { const [num,..
⚡️ React 실습하기 지난주부터 react 학습을 진행했는데, 아직 익숙하지 않고 개념이 명확히 정리되지 않는 부분이 많은거같음 작은 기능들부터 구현해가며 복습할 예정임 기초부터 복잡한것까지 순차적으로 실습해볼 예정입니다 ⚡️ 무엇을 만들어볼까? 버튼 눌럿을때 카운트 올라가는거 만들어보기 메모 앱 만들어보기 추후 만들어볼 목록은 이전 과제들을 진행해나가며 업데이트 예정 ... ⚡️ 어떤 플랫폼을 사용할까? 코드샌드박스나 코드펜을 써보려고 했으나, vs code와 실제 사용법이 조금 다른것 같아서 vs code를 이용해서 실습 예정임
⚡️ 객체 지향 프로그래밍 이란? 하나의 모델이 되는 청사진을 만들고, 그 청사진을 바탕으로 객체를 만들어나가는 프로그래밍 패턴이다. 그러면 객체란 무엇인가? 객체란 프로그램에서 사용되는 변수들과 값, 그리고 작업을 수행할 메소드를 서로 연관된 것들끼리 묶어서 만든것 쉽게 비유하자면, 객체는 레고 조각이고 레고 조각을 조립하여 무엇을 만드는 방식이 객체 지향 프로그래밍이다. 이러한 객체 지향 프로그래밍은 레고와 같이 부품화 할 수 있고, 재사용이 가능하다는 특징이 있다. ⚡️ 객체 지향 프로그래밍의 특징 ❗️ 캡슐화 데이터와 기능을 하나의 느슨한 결합으로 묶는 것이다. 속성과 기능을 정의하는 변수와 메서드를 클래스라는 캡슐에 넣어서 분류하는 것으로, 재사용이 쉽다는 장점이 있고, 내부 데이터나 내부 구현..
📝 기술면접 학습법 제시되는 단답형 질문이나 본인의 프로젝트 기술면접 질문에 대한 짧은 정답 작성하기 예상되는 꼬리질문 준비하기 단답형 질문과 꼬리 질문에 대해 풍부한 사례를 자신의 언어로 준비하기 다른 사람들의 블로그 자료 참조하여 깊게 고민해보기 하나의 기술적인 개념에 대해 결론을 내렸다면, 블로그로 작성해보기 ⚡ 정리 개발 지식에 대하여 어렴풋이 알고 있는 것이 아닌, 결론은 간단 명료하게, 설명을 구체적으로 자신의 언어로 설명할 수 있도록 모의 면접 연습 / 블로깅 하기. 📝 기술면접 질문 목록 ⚡ [HTML] 요소는 왜 요소의 자식 요소여야만 하나요? ❗️ li요소는 말 그대로 list의 item들을 보여주기 위한 요소 이기때문에, 목록을 담는 ul, ol의 자식 요소여야 합니다. ❓ [꼬리질문..
🟢 CSS 초안 구상 ⚡ 디자인 컨셉 과거 학창 시절 받았던 가정통신문(갱지 혹은 똥종이..?) 느낌이 나도록 디자인 컨셉을 정함 가정통신문 느낌을 살리기 위해 전체적인 색감은 그레이(회색) 톤으로 결정 폰트 역시 레트로 느낌을 위해 미래로 글꼴로 결정 ⚡ 디자인 초안 그리기 디자인 초안을 위해 FIGMA라는 웹 애플리케이션을 사용하였다. 완전히 처음 사용해보는 앱이라 모르는게 있을때마나 구글링, 유튜브를 참조하였습니다.. 토론하는 이미지는 Freepick 사이트의 rawpixel.com 작가님의 자료를 사용하였습니다. 컨셉에 맞게 영어 대신 한글을 사용함(사실 미래로글꼴 폰트 영문자가 이쁘지 않았음ㅎ) 실제 웹 CSS 적용시에는 갱지느낌을 살리기 위해 꾸깃꾸깃한 종이 배경을 사용할 예정임 ver.1의 ..