분류 전체보기 (669) 썸네일형 리스트형 WINK 공홈 Next.js 스터디 부터 시작하기 💫 (frontend/조다운) 🥨 개요WINK 에서 공식 홈페이지 리뉴얼을 시작하기를 앞두고, 리액트와 뷰만 써본 나에게 next.js 로 배포된 공식 홈페이지를 리뉴얼 하는 미션이 주어졌다 (내가 주웠다) 마침 노마드 코더에 부담스럽지 않은 Next.js 무료 강의가 있어 수강하고 블로깅 하게 되었다. 틈틈히 보다 보니까 오래 걸리게 된 이슈가 있다 진짜 열심히 봤음팀장이 (내가) 일요일 까지 블로깅 꼭 하라고 했는데 일요일이 되자 그런 규칙 만든 팀장 (나) 이 원망스러웟다포기할 뻔 암튼 공홈 부수기 화이팅~🥨 INTRODUCTION라이브러리 vs 프레임워크라이브러리는 사용자가 전체적인 흐름을 만들고 필요한 라이브러리를 자유롭게 호출하여 사용하는 것이고 프레임워크는 주도권을 프레임워크가 가지고 있으며 프레임워크의 흐름에 맞게 .. [2024 신입부원 기초 스터디] 박건민 #3주차 JavaScript란?웹페이지에 생동감을 불어넣기 위해 만들어진 언어...웹의 요소 제어React.js, Angular.js, Vue.js와 같은 프레임워크 및 라이브러리를 사용 가능Node.js, Express.js 등 백엔드 개발 가능 JavaScript의 특징객체기반 언어이며, HTML 문서 내에 내장되어 프로그래밍 요소를 추가할 수 있다.모든 객체는 숨겨진 링크인 프로토타입을 가지고 있다.인터프리터 언어로서 클라이언트 웹 브라우저에서 실행된다.컨텍스트를 만들고, 자신의 Scope : 클로저를 구현하여 실행한다.Node.js 프레임워크를 이용해 백엔드 개발에서도 사용 가능하다.객체형 / 함수형 프로그래밍 모두 표현 가능하다. HTML 내부/외부 구분내부(Inline) 스타일: HTML 요소의 sty.. [2024 신입부원 기초 스터디] 김규현 #3주차 JavaScript란?Ecma International의 프로토타입 기반의 프로그래밍 언어로, 스크립트 언어에 해당된다. HTML과 CSS에 더불어 웹을 구성하는 요소중 하나로 웹페이지가 동작하는 것을 담당한다. Java와는 다른 언어이며 백엔드개발에 활용가능 JS문법 1) 타입1, 2 Number 타입"abc" String 타입trueBoolean 타입[1. "abc". true]Array 타입 2) 연산자 - 산술연산자let a = 1; console.log(a + 1); // 더하기 산술 연산자 console.log(a - 1); // 빼기 산술 연산자 console.log(a * 1); // 곱하기 산술 연산자 console.log(a / 1); // 나누기 산술 연산자 console.log(a .. [2024 신입부원 기초 스터디] 김지나 #3주차 1. 자바스크립트란?: 웹페이지에 생동감을 불어넣기 위해 만들어진 언어: HTML, CSS로 처리할 수 없는 것들을 JS로 처리: 다양한 프레임워크, 라이브러리 사용(React, Vue): 백엔드 개발(Node.js-Express.js) 2. 자바스크립트 사용 방법01) HTML 내부: 02) HTML 외부: src 속성 이용 console.log("Hello World!") //script.js 3. 자바스크립트 문법01) 실행문은 세미콜론(;)으로 구분 02) 주석//주석/* 여러줄 주석 */ 03) 변수 선언var 변수1 = ""; //권장되지 않음let 변수2 = ""; //변수 선언시const 상수 = ""; //상수 선언시 04) 변수 이름 규칙- 예약어 사용 금지(if, for ...)- .. [2024 React.js 스터디] 박건민 #4주차 01. 리액트는 어쩌다 만들어졌을까?JavaScript를 사용하여 HTML 로 구성한 UI 를 제어한다면, 브라우저의 DOM Selector API 를 사용해서 특정 DOM 을 선택한 뒤, 특정 이벤트가 발생하면 변화를 주도록 설정해야 한다. 0 +1 -1 위 html/JS 코드는 +1 버튼이 눌리면, id 가 number 인 DOM 을 선택해서 innerText 속성을 1씩 더하는 규칙이 있다.위와 같은 방식은 인터랙션이 자주 발생한다면 이벤트 처리 로직이 복잡해지고 관리하기 힘들어진다. - DOM이란?Document Object Model의 약자로, HTML요소를 JavaScript Object처럼 조작할 수 있는 Model이다.DOM의 구조는 트리구조로, 아래에 여러 구성요소.. [2024 신입부원 기초 스터디] 김민서 #3주차 "JS" 자바스크립트 - 웹페이지에 생동감을 불어넣기 위해 만들어진 언어웹의 요소 제어 (HTML, CSS로 처리할 수 없는 것들을 처리 가능)다양한 프레임워크, 라이브러리 사용 (React, Vue)백엔드 개발 (Node JS - Express JS) 자바스크립트 사용 방법1. HTML 내부 2. HTML 외부 변수 선언var 변수 - 권장되지 않음let 변수 - 변수 선언const 상수 - 상수 선언* 변수 이름 규칙예약어 사용 금지문자 , _, $, 숫자 사용 가능숫자는 맨 앞에 올 수 없음 타입Number (ex. 1)String (ex. "abc")Boolean (ex. true)Array (ex. [1, "abc", true]) 연산자대입 연산자 =산술 연산자 더하기 +산술 연산자 빼기 -산술 연.. [2024 Spring Boot 스터디] 남윤찬#1 주차 - 1~3 섹션 섹션 1. 객체 지향 설계와 스프링스프링이란?좋은 객체 지향 애플리케이션을 개발할 수 있게 도와주는 Java 언어 기반의 프레임워크전통적인 J2EE(EJB)라는 겨울을 넘어 Java 진영의 새로운 시작, 봄(spring)이라는 뜻스프링 프레임워크: 스프링 DI 컨테이너, AOP와 같은 Spring 핵심 기술이 구현된 프레임워크로, 웹 기술, 데이터 접근 기술 등 많은 기능을 지원한다.스프링 부트: 스프링 빌드를 간편하고 편리하게 만들어주는 프레임워크이다.좋은 객체 지향 프로그래밍이란?객체 지향 프로그래밍프로그램을 명령어의 목록이 아니라 여러 개의 독립된 단위, 즉 “객체”들의 모임으로 파악하고자 하는 것추상화, 캡슐화, 상속, 다형성의 특징을 가진다. 그 중 스프링에서 핵심은 다형성이다.제어의 역전, 의.. [2024 신입부원 기초 스터디] 김태일 #3주차 본 글은 다음 pdf(~37p)를 보고 정리한 글입니다 자바스크립트란?HTML : 웹 페이지의 기본 구조를 담당CSS : 디자인을 담당JavaScript : 웹 페이지가 동작하는 것을 담당- 웹페이지에 생동감을 불어넣기 위해 만들어진 언어 자바스크립트의 역할- 다양한 프레임워크, 라이브러리 사용- 백엔드(서버) 개발- 웹의 요소 제어HTML, CSS로 처리할 수 없는 것들을 JS로 처리 자바스크립트 사용 방법- HTML 내부 - HTML 외부html의 body안에를 사용하고 파일.js 열어서 코드 작성 자바스크립트 문법- 자바스크립트 실행문은 세미콜론(;)으로 구분 - 주석실행할때 무시되는 코드// : 주석처리할때 사용(여러줄일때는 /* , */을 사용)//주석처리하기/* 여러줄주석처리하기 */ -변.. 이전 1 ··· 38 39 40 41 42 43 44 ··· 84 다음
