WINK-(Web & App)/HTML & CSS & JS 스터디 (126) 썸네일형 리스트형 [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 신입부원 기초 스터디] 김민서 #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 신입부원 기초 스터디] 김태일 #3주차 본 글은 다음 pdf(~37p)를 보고 정리한 글입니다 자바스크립트란?HTML : 웹 페이지의 기본 구조를 담당CSS : 디자인을 담당JavaScript : 웹 페이지가 동작하는 것을 담당- 웹페이지에 생동감을 불어넣기 위해 만들어진 언어 자바스크립트의 역할- 다양한 프레임워크, 라이브러리 사용- 백엔드(서버) 개발- 웹의 요소 제어HTML, CSS로 처리할 수 없는 것들을 JS로 처리 자바스크립트 사용 방법- HTML 내부 - HTML 외부html의 body안에를 사용하고 파일.js 열어서 코드 작성 자바스크립트 문법- 자바스크립트 실행문은 세미콜론(;)으로 구분 - 주석실행할때 무시되는 코드// : 주석처리할때 사용(여러줄일때는 /* , */을 사용)//주석처리하기/* 여러줄주석처리하기 */ -변.. [2024 신입부원 기초 스터디] 김수아 #3주차 JS(Java Script)"웹페이지에 생동감을 불어넣기 위해 만들어진 언어"JS는 본래 웹사이트에 사용될 목적으로 만들어졌다. (HTML은 웹페이지의 토대를, CSS는 이 요소들을 꾸민다.. 이 둘은 기능이 제한된 'Markup Language'이므로 'Programming Language'인 JS가 이에 생명을 불어넣는다)이에 JS는 '브라우저'로 한정되어 있었으나, Node.js / React Native / Electron 등의 개발로 활용범위가 확장되었다. JS는 파이썬이나 루비처럼 'Interpreter Language' (컴파일과정 거치지 않고 바로 실행)(vs. Compiled Language)동적 자료형을 가짐 (코딩 자유롭게)객체지향 지원하는 언어 (Prototype기반)First C.. [2024 신입부원 기초 스터디] 이종윤 #3주차 (JS 첫번째 수업) JavaScript란? Ecma International의 프로토타입 기반의 프로그래밍 언어로, 스크립트 언어에 해당된다. 특수한 목적이 아닌 이상 모든 웹 브라우저에 인터프리터가 내장되어 있다. 오늘날 HTML, CSS와 함께 웹을 구성하는 요소 중 하나다. HTML이 웹 페이지의 기본 구조를 담당하고, CSS가 디자인을 담당한다면 JavaScript는 클라이언트 단에서 웹 페이지가 동작하는 것을 담당한다. 웹 페이지를 자동차에 비유하자면, HTML은 자동차의 뼈대, CSS는 자동차의 외관, JavaScript는 자동차의 동력원인 엔진이라고 볼 수 있다.(나무위키) JavaScript로 무엇을 할 수 있을까? 1. 웹의 요소 제어 - JavaScript를 사용하여 HTML 요소를 선택하고 조작할.. [2023 신입부원 기초 스터디] 박승환 #8주차 마지막 JS @@ 요즘 알바를 너무 많이 해서 올리는 걸 신경을 못 썻네요 ㅎㅎ 늦어서 죄송합니다. 마지막 강의를 보니 실습 영상이더군요! 따라하면서 만든 결과물을 올리도록 하겠습니다!@@ 모달창 만들기 할 일 목록 만들기 지금 시간 알기 컴퓨터와 가위바위보 하기 늦었지만 오늘에서야 js블로그를 마무리 했다. 방학동안에는 HTML, CSS, JavaSctipt를 복습 및 추가적인 공부를 하면서 40일 프로젝트에 도움을 줄 것이고, 아직 JS에 대해서는 배울게 많은 것 같다. 파이썬과 비교해보면 JS는 내가 기입한 대로 흘러가는 느낌이라면, 파이썬은 논리적으로 생각을 해야되는 느낌? 설명을 잘하지는 못하겠다. 뒤에 있을 40일 프로젝트와 자율스터디 때 React를 배울 것인데 앞서 3개와 React를 공부해서 프론트엔.. [2023 신입부원 심화 스터디] 박지민 #마지막주 React.js 섹션 3~6 섹션 3. State 1. State 소개 - state는 props의 값에 따라 내부의 구현에 필요한 데이터 - props는 사용자가 component를 사용하는 입장에서 중요한 것 2. State 사용 class App extends Component { constructor(props) { super(props); this.state = { Subject: { title: "WEB", sub: "World wid Web!" } }; } render() { return ( title={this.state.Subject.title} sub={this.state.Subject.sub} ); } } export default App; App.js가 내부적으로 사용된다면 state를 통해 사용 Compone.. [2023 신입부원 심화 스터디] 신진욱 #마지막주 React.js 섹션 3 - 6 #귀칼보단 리액트지 ㅋ 섹션 3 - State 소개 1. state 소개 - state는 props의 값에 따라서 내부에 구현에 필요한 데이터들 2. state의 사용 class App extends Component { constructor(props) { super(props); this.state = { // state에서 subject를 초기화 Subject: { title: "WEB", sub: "World wid Web!" } // 하나의 값을 다룰 때! }; } render() { return ( title={this.state.Subject.title} sub={this.state.Subject.sub} ); } } export default App; - App.js가 내부적으로 사용된다면 state를 통해 사용.. 이전 1 2 3 4 5 6 7 8 ··· 16 다음
