profile
일일 개발 기록 블로그

javascript 버튼만들기 v1.0.1 (문제점 분석)

버튼만들기 버전 v1.0.0저번 포스팅에서 버튼을 한 번 만들어보았다. 크게 보았을 때 for문을 이용한 버튼 만들기 구현이었는데,기능구현에는 이상이 없었다. 그러나 이 기능은 새로운 버튼을 생성하는 기능과 섞어서 사용할 때 큰 문제가 발생하였다. 어떤 문제인지 지금

약 1시간 전
·
0개의 댓글

javascript 버튼만들기 V1.0.0

동적인 움직임을 구현하는데 EventLisner의 기능 구현은 필수이다.그중에서도 각각의 버튼에대한 기능 구현이 정말 중요한데, 인스타의 하트버튼 활성화 기능을 시험하다가, 댓글 한 개의 버튼을 클릭했을때 그 전체 페이지의 '사랑의 불빛'을 받는 불상사를 경험하게 되었

2일 전
·
0개의 댓글

리눅스 / 터미널 기초 공부

개발자들에게 리눅스가 많이 사용되는 이유?우선 리눅스는 리눅스 토발즈가 만든 OS에서 출발한다.윈도우, 맥OS, 안드로이드, ios는 일반인, 즉 개발자가 아닌 'end-user'들을 대상으로 만든 운영체제이다. 그래서 이것들은 접근하기 어려운 모습이 아닌 GUI가 잘

5일 전
·
0개의 댓글

HTTP - 웹서비스 관련 용어

HTTP는 HyperText Transfer Protocol의 약자이다.뜻을 간략하게 풀이해보자면,'컴퓨터들끼리 HTML파일을 주고받을 수 있도록 하는 소통방식에 관한 약속이다.HTTP의 핵심은 '통신'이다. 보내는 주체가 있으면 받는 주체가 있기 마련이고,우리는 이러

2020년 9월 20일
·
0개의 댓글

javascript scope

scope은 JavaScript의 문법이 아니다.JavaScript에서 scope이란, '변수가 어디까지 쓰일 수 있는지'의 범위를 의미.변수는 let, const, var 등으로 선언할 수 있고,어떤 변수는 여기저기서 쓸 수 있는 반면에, 어떤 변수는 특정 함수 내에

2020년 9월 19일
·
0개의 댓글
post-thumbnail

javascript 날짜와 시간

날짜와 시간을 저장하고 보여줄 때 날짜 객체를 사용합니다.날짜 객체를 호출하면 쉽게 시간과 날짜를 얻을 수 있습니다.날짜 객체를 생성할 때는 다음과 같이 new 연산자 다음에 Date 생성자를 씁니다.new Date();브라우저마다 표현하는 법이 조금씩 다른데,시간이

2020년 9월 19일
·
0개의 댓글

javascript 문자열(string)

String 파헤치기! 이제까지 쌍따옴표("") 안에 텍스트가 들어가면 String형이라고 배웠습니다. 사실은 지금까지 코드에 홑따옴표도 많이 썼습니다. 쌍따옴표든, 홑따옴표든 모두 String형 값에 사용합니다. 어차피 코딩 컨벤션을 따르게 되어있는데 아래의 예시를

2020년 9월 19일
·
0개의 댓글

javascript 데이터 타입

데이터 타입이제까지 type이라는 단어를 몇 번 언급했습니다.이번 시간은 JavaScript에 있는 6가지 데이터 타입을 알아보겠습니다.❗️다음에 나오는 것은 숫자로 변환시 무엇으로 인식하는지...undefined ❗️ NaNnull
❗️ +0boolean (true/

2020년 9월 19일
·
0개의 댓글

javascript 배열, 배열조작

배열은 대괄호(\[])로 감싸져 있습니다.let a = \[] 처럼 빈배열을 선언해주는 것도 가능하다.이제 데이터가 있는 배열을 만들어보겠습니다.let cities = "서울", "대전", "대구", "부산", "광주", "제주도";"서울", "대전"과 같은 배열의 값

2020년 9월 16일
·
0개의 댓글

javascript Function(함수)

함수란? 하나의 특정한 작업을 수행하도록 설계된 독립적인 블록입니다.
변수에 이름이 있듯이, 함수도 이름이 있습니다. 함수 이름을 부르면, 함수 내에 있는 코드가 실행됩니다.함수를 불러 실행시키는 것을 앞으로 "함수를 호출한다" 라고 표현한다. 함수를 정의만 하고 호출

2020년 9월 16일
·
0개의 댓글

javascript 반복문, 연산자

!!전에 정리해둔 것이 있으나 새로운 도큐먼트로 정리된 것을 가져와서다시 써 놓았다!!if (조건) { true면 실행}else {false면 실행}❗️else if는 중간에 추가하고 싶은 조건이 있을 때 아래 모양처럼 만들어주면 된다.=== 엄격한(identity/s

2020년 9월 16일
·
0개의 댓글

javascript 텍스트 문자열의 연결

console.log("안녕" + "하세요"); //안녕하세요console.log("안녕" + "하" + "세요"); //안녕하세요console.log("안녕" + "하세" + "" + "요"); //안녕하세요텍스트가 할당된 변수let hi = "안녕";console.

2020년 9월 16일
·
0개의 댓글

javascript 수학 표현식

사칙연산 등의 수학 표현식은 다음과 같이 간단하게 사용할 수 있습니다. let a = 1.3;let b = 2;let c = -10;console.log(a+b);console.log(bc/10);console.log(a+10);console.log(450-30);co

2020년 9월 16일
·
0개의 댓글

javascript 변수(variables)

컴퓨터는 많은 데이터를 기억하기위하여변수를 사용한다.프로그래밍을 하기 위해서는 다양한 값(value)을 다뤄야 하고, 그 값들은 각각의 변수에 저장되어 사용된다.JavaScript에서 변수를 선언하고 값을 할당하는 방법은 다음과 같습니다.위에서 변수의 할당 방법을 배워

2020년 9월 16일
·
0개의 댓글

javascript 소개 및 주석

우리가 앞 부분에서 배운 HTML과 CSS를 가지고웹 페이지의 구조와 디자인을 짤 수 있지만 이것 이외에도 JavaScript 코드를 이용하여 동적인 요소를추가해볼 수도 있다. 그리고 이런 자바스크립트 코드는 거의 모든 웹 사이트에 적용이 되어있다.JavaScript

2020년 9월 16일
·
0개의 댓글

HTML/CSS 반응형 웹

반응형 웹이란, 하나의 웹사이트가 접속하는 기기의 디스플레이 종류에 따라 화면의 크기가 자동으로 변하는 웹 페이지를 의미합니다. 오늘날에는 IT 기기의 종류가 더욱 다양해짐에 따라 디스플레이의 크기에 맞게 유동적으로 반응하는 반응형 웹을 구현하는 것이 더욱 중요해졌습니

2020년 9월 16일
·
0개의 댓글

HTML/CSS inline, inline-block, block 에 대해서

block은 무조건 한줄을 점유하고, 다음 태그는 다음 줄로 가버리죠.상자가 아니라 특정한 아이템을 아이템의 크기만큼 갖고 있는 요소로 연달아 inline요소가 나오면 줄이 바뀌는 것이 아니라 옆에 위치하게된다.block이 갖는 성질을 갖지 못한다.width/heigh

2020년 9월 15일
·
0개의 댓글
post-thumbnail

HTML/CSS Float레이아웃

float 기반 레이아웃 float은 주로 이미지 주변에 텍스트를 감싸기 위해 만들어진 프로퍼티이다. 요즘은 flex를 활용하여 레이아웃을 짰지만, 예전에는 float을 활용하여 배치하는 경우가 많았다. 뭐 지금도 브라우저 호환성 문제때문에 여전히 사용하는 곳이 있으

2020년 9월 15일
·
0개의 댓글

Semantic Web과 Semantic Tag

"사이트에 이미지를 넣는 방법은 두 가지가 있습니다. <img> 태그를 사용하는 것과 <div> 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요."놀랐다... 아는건데도 이렇

2020년 9월 15일
·
0개의 댓글

CSS Position(static, relative, absolute, fixed)

Position html 코드와 상관없이 그리고 싶은 어느 위치에나 요소를 그리고 싶을 경우 사용! 예를 들어 index.html에서 코드의 위치는 제일 마지막인데, 페이지에서는 제일 위에 보이게 할 수 있습니다. 일단 포지션은 크게 4가지로 구분해서 자주 사용한다

2020년 9월 15일
·
0개의 댓글