반응형

웹개발 11

[도서리뷰] '완성된 웹사이트로 배우는 자바스크립트' 비전공개발자의 서평

'완성된 웹사이트로 배우는 자바스크립트'는 HTML, CSS, 자바스크립트를 처음 접하는 비개발자들 또는 개발자가 되고싶지만 아직 적성에 맞는지 아닌지를 가늠하기에 좋은 책이라고 생각합니다. 2년전 엑셀이 좋아서 개발로 뛰어들었을 때를 생각하면, 적성확인 차 먼저 이런책들을 접할 수 있었다면 더 좋았을텐데라는 생각을 하게 만드는 책입니다. HTML, CSS, 자바스크립트 아무것도 몰라도 그냥 일단 따라서 만들어보기에 초점이 맞추어져있는 책이며, 관심이 생긴다면 구글링 또는 유튜브를 통해 좀 더 자세히 공부해가면 될 것 같네요. 작가 '완성된 웹사이트로 배우는 자바스크립트'는 2년간 일본에서 그래픽 디자이너로 일한뒤 캐나다 벤쿠버에서 학교를 졸업한 'Mana'라는 일본인 웹디자이너의 책이다. 한국어로 번역..

Day by Day 2024.04.12

TS와 TSX 차이 진짜 간단 명료하게 알려드림!

지금 next.js로 프로젝트 하나 하고 있는데 아무리 생각해도 ts와 tsx의 차이를 모르고 있는 것 같아 궁금해서 찾아보았다. 정말 구구절절한 설명 다 빼고 간단하다. ts는 typescript만 사용할 때 tsx는 React Component에서 사용시 사용! 나는 Component에서 사용중이니까 tsx, 하지만 타입스크립트만 쓰는 리액트 컴포넌트가 없는 경우라면 .ts인 확장자를 쓰면 된다!.

TS 2023.07.05

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - 중앙처리장치 CPU

중앙처리장치(CPU) - 메인보드에 가장 먼저 연결하는 장치 중 하나 - 인간의 뇌와 같은 역할 - 연산과 제어를 담당 - 3가지 모듈 => 산술/논리장치 (Arithmetic Logic Unit, ALU), 제어장치(Control Unit), 레지스터 (Register) 레지스터(Register) - 기본적으로 프로세스는 메인 메모리에 적재된다. - 실제 연산은 CPU내부에서 수행되므로, 데이터를 CPU로 가져와 처리해야한다. => 데이터를 일시적으로 CPU내부에 저장할 공간이 Register => 레지스터는 CPU의 현재 상태를 저장할 공간으로 사용되기도 한다. 산술/논리 연산 장치 (ALU) - CPU가 실질적으로 연산을 처리할 수 있도록 한다. - 산술 연산(+,-,*,/ 등) 및 논리 연산(AN..

CS지식 2023.06.20

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - 컴퓨터 구조 기초2

일반적인 구조 - 하드웨어 : 컴퓨터가 동작하도록 해주는 내부 물리적인 장치들 - 소프트웨어 : 컴퓨터가 어떻게 동작해야하는지 명시되어있는 명령어 집합 일반적인 하드웨어 구성요소 소프트웨어 - 시스템 소프트웨어 : 하드웨어 자원에 대한 접근이 용이하며, 대개 저수준 언어로 작성된다. => 펌웨어, 운영체제, 컴파일러, 장치드라이버 - 응용 소프트웨어 : 컴퓨터 자원에 대한 직접적인 접근이 제한되며, 대개 고수준언어로 작성된다. 시스템 소프트웨어에 비해 접근하기 쉽고, 친화적이라는 장점이 있다. =>게임, 웹 브라우저

CS지식 2023.06.20

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - 컴퓨터 구조 기초

메인보드(Motherboard) - 다양한 물리적인 장치를 장착할 수 있는 인쇄회로기판(PCB) - 컴퓨터의 CPU, 메인 메모리, 하드디스크(보조기억장치) 등을 장착한다. - 다양한 컴퓨터 부품을 연결할 수 있는 인터페이스 제공 - Motherboard라고도 불림 GPU(Graphics Processing Unit) - GPU는 그래픽 관련 연산을 빠르게 처리하는 답을 도출하는 연산 장치 - 인공지능(딥러닝), 고화질 게임, 무인 자동차등에서 많이 쓰인다. - 컴퓨터 그래픽 / 영상처리에 유용하게 활용 - 대규모 행렬 및 벡터연산을 처리하는데에 뛰어난 성능을 발휘 보조기억장치( 하드디스크, SSD ) [Pros] 전원이 차단되어도 내용이 유지되고, 저장 용량이 크다는 장점 [Cons] 보조기억장치는 메..

CS지식 2023.06.19

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - JWT

JSON - JSON(JavaScript Object Notation) 은 데이터를 주고 받기 위해 사용하는 경량의 데이터 형식 중 하나 - JSON 형식에서는 KEY - VALUE 쌍으로 이루어진 데이터 객체를 사용 Session - 서버에서 가지고 있는 객체로, 특정 사용자의 로그인정보를 유지하기 위해 사용 [Pros] - 클라이언트에게는 세션 ID(회원식별목적)를 제공하고, 회원에 대한 중요한 정보를 서버가 가진다. - 민감한 데이터를 클라이언트에 직접적으로 보내지 않는다. - 클라이언트 브라우저가 가지고 있는 세션ID 자체에는 개인정보를 포함하고 있지 않다. [Cons] - 악의적인 공격자가 세션 ID를 탈취하여 사용자인 척 위장할 수 있다. =>세션 ID를 탈취당하는 경우, 사용자의 많은 권한 ..

CS지식 2023.06.19

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - REST API

REST 등장배경(Representational State Transfer) - HTTP는 다양한 HTTP 메서드(GET, POST, PUT, DELETE 등) 를 지원한다. - 실제로는 서버가 HTTP 메서드를 기존 설명에 맞게 사용하지 않더라도, 프로그램 개발은 가능하다. 하지만 각 서비스가 서로 다른 방식으로 개발한다면, 개발자 사이의 소통에 문제가 발생할 수 있다. - 따라서 기준이 되는 아키텍처로 REST를 채택할 수 있다. REST의 구성요소 - 특정한 자원에 대하여, 자원의 상태에 대한 정보를 주고받는 개발 방식이다. 자원(Resource) URI 이용 행위(Verb) HTTP 메서드 이용 표현(Representation) 페이로드(Payload) 이용 REST 예제( 회원가입 ) ID : ..

CS지식 2023.06.16

[CS지식] 프론트엔드 개발자가 알아야하는 컴공지식 - HTTP

HTTP - 웹상에서 데이터를 주고받기 위한 프로토콜이다. - 웹 문서를 주고 받기 위해 사용한다. - 웹뿐만 아니라 모바일앱, 게임 개발에서도 다양한 목적으로 사용되곤 한다. HTTP Method METHOD 설명 예시 GET 데이터 조회 요청 특정 페이지 접속, 정보 검색 POST 데이터 생성 요청 회원가입, 글쓰기 PUT 데이터 수정 요청 회원 정보 수정 DELETE 데이터 삭제 요청 회원 정보 삭제 HTTP 상태 관리와 세션 - HTTP는 상태를 저장하지 않는다.(Stateless) - 클라이언트는 HTTP로 서버에 연결한 뒤에, 응답을 받으면 연결을 끊어버린다. => 서버입장에서 접속 유지에 대한 요구가 적어, 불특정 다수를 대상으로 하는 서비스에 적합하다. 예시로, 상품확인 -> 장바구니 ->..

CS지식 2023.06.16

[노개북챌린지] CleanCode TIL 3장 함수

DAY 5 범위 : 3장. 함수 ▶ 책에서 기억하고 싶은 내용 ** 포트란 : 1950년대 말에 IBM의 존 배커스(John Backus) 외 6명의 전문가가 완성한 최초의 고급프로그래밍 언어 중 하나, 알골과 함께 과학계산용으로 주로 사용되며 매우 간결하고 엄격한 구문형식을 가지고 있다. https://namu.wiki/w/%ED%8F%AC%ED%8A%B8%EB%9E%80 ** PL/1 : Programming Language One의 약어 프로그래밍 초창기에는 시스템을 루틴과 하위 루틴으로 나눴고, 포트란과 PL/1 시절에는 시스템을 프로그램, 하위프로그램, 함수로 나눔. 현재는 함수만 남았으며, 어떤 프로그램이든 함수가 기본이다. 이 장에서는 함수를 만드는 규칙에 대해 설명하고 있다. ▶ 작게 만들..

CS지식 2022.02.22

[노개북챌린지] CleanCode TIL 2장 의미 있는 이름

DAY 3 범위 : 2장. 의미있는 코드 ▶ 책에서 기억하고 싶은 내용 [ 변수, 함수, 클래스명 작성시 의미있는 이름으로 명명하라 ] ◎ 의도를 분명히 밝혀라 ◎ 그릇된 정보를 피하라 ◎ 의미 있게 구분하라 ◎ 발음하기 쉬운 이름을 사용하라 ◎ 검색하기 쉬운 이름을 사용하라 ◎ 인코딩을 피하라 ◎ 자신의 기억력을 자랑하지마라 ◎ 한 개념에 한 단어를 사용하라 ◎ 말장난을 하지마라 ◎ 해법 영역에서 가져온 이름을 사용하라 ◎ 문제 영역에서 가져온 이름을 사용하라 ◎ 의미 있는 맥락을 추가하라 ◎ 불필요한 맥락을 없애라 ▶ 오늘 읽은 소감은? 떠오르는 생각 요즘엔 변수명 지어주는 사이트가 있다보니 영문으로 변수명작성은 너무 쉬운일이 되어버려서 변수명을 어떤 이름으로 지을지 생각을 하지 않는다. 물론 사이트..

CS지식 2022.02.21

[노개북챌린지] CleanCode TIL 1장 깨끗한 코드

DAY 2 범위 : ~ 1장. 깨끗한 코드 ▶ 책에서 기억하고 싶은 내용 ◎ 코드는 요구 사항을 표현하는 언어 ◎ 르블랑의 법칙 ( Leblanc's Law, 나중은 절대 돌아오지 않는다는 법칙 ) ◎ 나쁜 코드가 쌓일수록 팀 생산성은 떨어짐 ◎ 깨끗한 코드란 세세한 사항까지 꼼꼼하게 처리하는 코드 ◎ 깨끗한 코드는 단순하고 직접적 ( 가독성 ) ◎ 깨끗한 코드는 작성자가 아닌 사람도 읽기 쉽고 고치기 쉬움 ( 유지보수용이 ) ◎ 깨끗한 코드는 언제나 누군가 주의 깊게 짰다는 느낌을 주는 것 ◎ 단순한 코드규칙 →모든 테스트를 통과 →중복x →시스템 내 모든 설계 아이디어를 표현 →클래스, 메서드, 함수등을 최대한 적게 작성 ◎ 보이스카우트 규칙 ( 모듈을 체크인할 때는 항상 체크아웃했을 때보다 깨끗해야..

CS지식 2022.02.19
반응형