본문 바로가기
728x90

> 코딩애플 (부분공개)232

this 키워드를 알아보자 1. 함수와 Object에서 사용하면? 개발하면서 은근 자주 찾아볼 수 있는 this 키워드는 뜻이 매우 다양합니다. 사용하는 환경에 따라서 4개 이상의 각각 다른 뜻을 가지고 있는데  이번 기회에 총정리해드리겠습니다. 1-1. 그냥 쓰거나 함수 안에서 쓰면 this는 window를 뜻합니다. 그냥 HTML 파일 아무거나 하나 만들고 중간에 이렇게 변수를 큰 공간에 만드시면 x라는 변수는 window라는 큰 오브젝트안에 자동적으로 생성됩니다. 함수도 마찬가지고요.아무튼 그냥 보관소입니다. 끝! *전역변수 : 코드 내 모든 곳에서 참조해서 쓸 수 있는 범용적인, 범위가 넓은 변수입니다. 그냥 script 태그 내에 쌩으로 var 변수 하나 만들면 그건 자연스레 전역변수가 됩니다. 비유를 들어 설명전역변수를 비유로 설명하면, 전역변수는 모든 사람.. 2024. 7. 27.
강의 듣기 전 자바스크립트 기본 문법 총정리 js 사용 이유p 태그 변경안녕 -> 바보버튼을 클릭했을 때 변경하고 싶은 경우,addEventListner 사용잠깐 자료 저장하기var / let / const변수 만들 수 있는 키워드긴 코드 쓰기 싫으면 축약 가능.function 사용중괄호 안에다가 내가 축약하고 싶은 긴 코드 넣어주면 된다.작명() 이렇게 쓰면 됨.함수를 쓰면서 축약을 할 수 있는데파라미터로 업그레이드도 할 수 있음.작명한 거를 안쪽 어딘가에 집어넣으면 됨.이렇게 써주면 작명이라는 함수를 실행해주는데 파라미터 자리에 "바보" 를 넣어서 실행해 달라는 뜻.함수 업그레이드 하는 파라미터 문법컴마로 여러개 집어넣을 수 잇음. 화살표 함수로 function 대체배열조건 부 코드조건식을 여러개 쓰고 싶은 경우&& 또는 ||  if 문에 있는.. 2024. 7. 27.
강의 OT (수강대상, 강의 특징정리) OT입니다. 자바스크립트 기초문법 배워서 웹UI 만드는건 쉽게 하실 수 있을텐데,이제 그 다음이 문제입니다. Angular, React 이런걸 하기 위해선, 서버를 만들기 위해선 어려운 문법 개념들이 필요합니다. 그래서 다시는 문법책 펴지 않아도 될 정도로 만들어드리는 중급과정을 준비했습니다.  일단 필요한 사전지식은var function if for forEach eventListener[Array] {Object} 자료만들고 수정하는 법이렇게 배우신 후 수강하시면 수월합니다. 기초강의 듣고오시면 됩니다. 다른 언어 하다오신 분들은 그냥 들으셔도 무방합니다. 여러분의 JavaScript 공부 고민 1. 어려운 용어 사용 책이나 구글 검색결과보면 너무나도 어려운 표현들이 기다리고 있습니다. 인스턴스, 1.. 2024. 7. 27.
HTML에 데이터 꽂아넣는 Vue 데이터바인딩 문법 오늘의 5분 숙제 : 일단 이렇게 생긴 데이터를 하단에 하나 저장하십시오. products : ['역삼동원룸', '천호동원룸', '마포구원룸'] ▲ 그 데이터와 {{데이터바인딩}} 문법으로 대충 이렇게 생긴 HTML 레이아웃을 만들어오십시오. 가격은 대충 임시로 아무거나 기입하시길 바랍니다.  HTML에 자바스크립트 데이터를 꽂아넣고 싶을 때가 있습니다. 데이터바인딩이라고 하는데Vue에서 데이터바인딩 하는 문법을 2개 알아보도록 합시다. 근데 애초에 데이터바인딩을 왜 하는지 의문점 부터 들지 않습니까.그런거 궁금해해야 나중에 여러분 데이터 바인딩 할지 말지 스스로 판단하는 훌륭한 사람이 됩니다. 그것 부터 알아봅시다. Vue 개발은 어려운게 아닙니다  dkssudsfadf우선 HelloWorld 글.. 2024. 7. 12.
페이지 레이아웃 만들기 (React 기초문법) 오늘의 숙제 :심심하면 html css 작성해서다음 시간까지 여러분 웹사이트의 대문을 마음대로 꾸며옵시다.  웹개발하려면 우선 유저들이 방문할 웹페이지같은게 있어야할거아닙니까그래서 가장 먼저 웹페이지 레이아웃 만드는 법을 알아봅시다. page.jsx 파일이 메인페이지라서 거기에 코드짜면 되는데 레이아웃 만들 땐 React 문법을 이용해야합니다. Next.js는 React 위에 얹혀있는 프레임워크같은거라서요. 우선 저번시간 프로젝트 열어서 page.jsx 안의 html 내용과 global.css 안의 내용은 지우고 시작해봅시다.  실은 리액트라고 다른거 없고 html css 문법 그대로 쓰면 레이아웃 만들 수 있는데 리액트에선 html css가 아니라 JSX 라는 문법을 사용하게 되어있습니다.생긴건 htm.. 2024. 7. 12.
Next.js 설치와 개발환경 셋팅 개발환경 셋팅(맥이나 윈도우나 똑같습니다) 1. 구글에 Nodejs 검색해서 LTS라고 써있는 버전을 설치합시다. - nodejs 18버전 이상에서만 잘돌아감- 설치 경로는 C드라이브 어쩌구 되어있는거 바꾸지말고 그대로 쓰는게 좋습니다.- 설치 중 chocolatey 어쩌구는 설치하지 맙시다. 2. Visual Studio Code 에디터도 구글에 검색해서 설치합니다.평소에 쓰던 에디터 쓰셔도 되지만 터미널을 기존에 안다뤄본 분들은 설치합시다.Next.js 프로젝트 생성은  1. 작업용 폴더를 하나 만들어줍니다오픈 폴더 해서 열어줌.이 명령어 입력하고 엔터키 치면 된다. npx create-next-app@latest프로젝트 이름 작명하라고 하면 작명하면 됨. fresh 라고 프로젝트 이름 설정또 그 다.. 2024. 7. 11.
728x90

티스토리툴바