푸르생 스토리

개발일을 하다 보면 앞으로도 계속 있을 오류가 났음을 지시하는 경고가 뜨는데요 내용을 보아하니 SyntaxError 가 가장 중요한 포인트입니다. Syntax는 문법을 말하는 것이고 Error는 에러로 문법 에러가 났음을 알려주는 경고창입니다. 작성된 코드에서 VM232 : 1에서 에러가 났음을 알 수 있는데요. 해당 코드에서 끝에 ' : ' 다음에 나오는 숫자가 작성된 코드의 줄을 나타냅니다. 몇 번째 줄에서 오류가 났는지 확인하면 디버깅을 할 때 보다 쉽게 원인을 알 수 있겠죠? 아! 참고로 위의 문법 에러는 따옴표가 " 큰 따옴표로 시작되고 ' 작은따옴표로 끝나서 문법에 에러가 생긴 것입니다. 좀 더 자바스크립트에 대해 알고 싶다구요? 그럼 아래 링크를 순차적으로 보시는것을 추천 드려요! 2021/..

JavaScript에서의 수의 특징 1. 자바스크립트에서는 큰따옴표나 작은따옴표가 붙지 않은 숫자는 숫자로 인식한다. '' 작은따옴표와 "" 큰 따옴표가 숫자 양쪽에 붙지 않았다면, 자바 스크립트 내에서는 숫자로 간주한다. 이는 +, -, *, / 등등의 수학 연산자에도 해당되며, 모든 수학 공식을 alert( 얼럿 함수 내에 기재 하면 얼럿에서 연산 처리 결과물을 출력하여 준다. ) 2. 자바스크립트에서는 Math 가 붙은 함수는 숫자로 인식하여 연산한다. 예를 들면, 얼럿(alert) 괄호 안에 들어있는 100(숫자 와) * Math.random() ( 함수 )가 있으나 실제로 이는 숫자 곱하기 숫자의 개념으로 받아들이기 때문에 연산처리가 가능하다. 결과물, 랜덤으로 값을 만들어 내는것은 실수의 숫자..

자바스크립트에서는 큰따옴표나 작은따옴표가 붙지 않은 숫자는 숫자로 인식한다. 정수 예 ( . . . -3, -2, -1, 0, 1, 2, 3, . . . ) 소수점이 없는 딱 떨어지는 숫자의 경우 와 실수 예 ( . . . -2.99, 0.98, 0.02, 1.08, 2.007 . . . ) 소수점이 있는 숫자의 경우 모두 '' 작은 따옴표와 "" 큰 따옴표가 숫자 양쪽에 붙지 않았다면, 자바 스크립트 내에서는 숫자로 간주한다. 이는 +, -, *, / 등등의 수학 연산자에도 해당 되며, 모든 수학 공식을 alert( 얼럿 함수 내에 기재 하면 얼럿에서 연산 처리 결과물을 출력하여 준다. ) 기본적인 틀은 이러하며, 자신이 사용하는 개발 도구 내에서 html 이라고만 친다면 기본적인 틀이 자동으로 기입된..

아톰을 사용하시다 보면, 지나치게 깔끔함 때문에 사이드바가 어떻게 열리는지 모르는 분들이 많으신데요. 이렇게 생긴 창 화면에서 Add folders 버튼을 눌러 자신이 만든 html 파일이 있는 디렉토리(폴더)를 열어줍니다. 자! 사이드바가 열리는것을 확인 하였죠? 다른 IDE 도구에서도 보통 Veiw 칸이나 Tool 칸에 사이드바가 있으니 찾아보시면 되겠습니다.

; 세미클론은 앞에서의 명령이 명시적으로 끝났다는 것을 의미하는 역할을 수행합니다. 세미클론이 없이 실행을 하더라도, 코드는 잘 작동 합니다. 왜냐하면 한 줄 한줄 넘어갈 때마다 자동적으로 세미클론이 붙는 것과 같은 기능을 하기 때문이죠. 하지만 세미클론이 반드시 필요한 경우가 있는데 이와 같이 한 줄에 여러 명령이 존재 할 때 이죠. 이러한 명령어는 한줄에 있기 때문에 컴퓨터는 어디서부터 명령이 끝나는지 모릅니다. 때문에 세미클론을 붙여주어 명령을 끝내주는 마감이 필요합니다. 다음과 같이 구간별로 들어와 있는 들여 쓰기가 되어 있는 것은 사용자의 육안으로 보기 편하게 만들어 주는 것으로 키보드에서 tap 키를 눌러 들여 쓰고 back 키를 눌러 되돌릴 수 있습니다.

위 문장에서 주석으로 기재 되어있는 TEXT 들을 브라우저 창을 실행 시킨다면, 이러한 형태로 브라우저에서 에러로 표시하며, 우측에 html:10로 적혀 있는 부분에서 작성된 코드에서 어느 부분이 오류가 나는지 알려줍니다. 주석, 주석, 주석을 영어로 Comment 라고 적혀있는 코드 앞에 // 를 넣어주면 다음과 같이 텍스트가 연하게 잡히는데 코드를 실행해 보면 다음과 같이 오류가 없어짐을 확인 할 수 있습니다. 참고로 // 는 10번줄에 넣었다면 1줄에만 주석 처리가 가능하며 1번 줄 부터 /* */ 4번 줄 까지 이런식으로 주석 처리 했다면, 여러줄을 한번에 주석 처리가 가능합니다.

크롬 개발자 도구란? 구글에서 만든 웹브라우저인 크롬에는 개발을 도와주는 다양한 도구가 기본적으로 제공됩니다. 이를 개발자 도구라고 합니다. 개발자 도구를 이용하면 HTML, CSS, JavaScript의 생산성을 극대화할 수 있습니다. 이러한 도구들을 지칭하는 단어는 IDE 라고 합니다. IDE는 정확하게 이야기하자면 통합 개발 환경(Integrated Development Environment, IDE) 라고 하며, 저는 아래에 보이는 아톰(Atom)을 사용하고 있습니다. 매우 가볍고 사용자의 시각적으로 보기 편안하게 도와 주는 도구입니다. 아톰은 다음과 같이 브라우저에서 무료로 다운로드가 가능하며 atom.io/ A hackable text editor for the 21st Century At G..

해당 설명글은 윈도우에서 크롬 브라우저를 기준으로 하여 설명하는 글입니다. 브라우저의 콘솔 사용 방법 가장 먼저 브라우저를 실행 시키고 F12 버튼을 눌러줍니다. 그럼 우측에 Console 창이 뜹니다. 해당 콘솔창에서는 HTML 코드는 필요 없이 순수 JavaScript 언어만 사용하면 됩니다. 콘솔 창에 alert('Hello world'); 라고 치고 엔터를 누르면 다음과 같이 얼럿이 뜨는것을 확인 할 수 있습니다. 그리고 다음과 같이 작성한 뒤 브라우저를 열어보면 다음과 같이 얼럿과 콘솔 창에 Console Hello world 로그가 남는것이 보입니다. 얼럿은 브라우저 창에서 콘솔 로그는 콘솔창에서 뜨는것이 구분되는 이유는 매번 얼럿이 뜨면 팝업창을 끄는데 번거롭기 때문에 개발자의 편의상 콘솔 ..

해당 글은 윈도우 버전으로 설명을 하는것이니 이점 참고 바랍니다. 메모장에 다음과 같이 입력하여 준다. 작성된 메모장을 다음과 같이 이름을 설정하여 파일형식은 모든 파일로 지정하고 저장한다. 자 저장한 파일을 찾아서 실행 시킨다. 그럼 다음과 같은 브라우저가 열리면서 얼럿이 뜨는것을 확인 할 수 있다.

요약. 웹브라우저를 프로그래밍적인 제어로 컨트롤 하기 위한 언어이다. 위의 코드를 통하여 Hello world 라는 내용을 가진 버튼을 만든다. 그 버튼을 누르면 얼럿이 뜨는데 그 내용은 Hello world 이다. 라는 내용을 실제로 실행 해 보면 라는 브라우저 상에서 헬로우 월드라는 버튼이 출력 되고, 버튼을 누르면 해당 얼럿을 뜨게 된다. 자, 그럼 다음 코드는 HTML 코드와 다른게 무엇이고, 어떤 부분이 JavaScript 인가? 바로 이 부분이 자바 스크립트를 의미한다. 자바스크립트는 프로그래밍적으로 브라우저를 컨트롤 한다. alert 이라는 이미 브라우저에서 가지고 있는 기능을 코드를 통해서 제어하는것이다. 자바스크립트는 프로그래밍적으로 웹브라우저를 컨트롤 하는 언어이다. 고로 웹브라우저와 ..