본문 바로가기

자바스크립트11

728x90
반응형
뷰(Vue.js)란 무엇이며 누가 사용하는가? 뷰는 무엇인가?뷰(Vue.js)는 프론트엔드 개발용 프레임워크이다. 뷰는 리액트와 양대 상맥을 이루는 오픈소스 프론트엔드 개발용 프레임워크이다. 뷰에서는 화면을 개발할 때 HTML와 CSS, Javascript를 조합하여 사용한다. 뷰로 개발할 때는 통합개발환경(Integrated Development Environment, IDE)으로 Visual Studio를 많이 사용하는 편이다.뷰의 특징뷰에서는 화면을 개발할 때 HTML와 CSS, Javascript를 조합하여 사용하기에 기존의 웹 개발자들이 빠르게 익힐 수 있는 특징이 있다. 뷰는 프레임워크답게 코드 재사용성이 높고 화면 배치를 위해 HTML과 CSS를 사용하기에 직관적이라 코드 생산성이 높다. 뷰는 개발 기간이 짧고 자주 수정되는 SI 업계에.. 2024. 11. 13.
[IT 용어] ESLint 정의ESLint는 자바스크립트 코드를 분석하여 문제점을 알려주는 정적 분석 도구이다. 코딩 스타일 등의 자체 규칙을 설정할 수 있다.기타ESLint는 코딩스타일을 통일해야 하는 대부분의 개발 프로젝트에서 사용하기 적합하다. 특히 숙련도가 낮은 인원들이 많은 상황에서 ESLint를 사용하면 최저 코드 품질을 방어하는데 도움이 된다. 참고문서ESLint, 위키백과, 2023년 4월 14일. @원문보기 2024. 8. 20.
마인크래프트 에듀케이션 에디션을 PC에 설치하자 본 글에서는 윈도우 PC에 설치하는 과정을 설명합니다. 1. 로그인 계정 생성 소속 기관이 마인크래프트 에듀케이션 에디션과 협약되어 있다면 계정을 발급 받을 수 있습니다. 2. 마인크래프트 에듀케이션 설치 파일 다운로드 아래의 주소로 가서 마인크래프트 에듀케이션 에디션 설치 파일을 받습니다. 다운로드 주소: https://education.minecraft.net/ko-kr/get-started/download 3. 프로그램 설치 아래와 같이 마인크래프트 에듀케이션 에디션 설치파일이 정상적으로 다운로드되면 실행하여 설치합니다. 아래의 사진들처럼 설치를 진행합니다. 4. 프로그램 실행 위의 사진처럼 설치가 마무리되면 자동으로 마인크래프트 에듀케이션 에디션이 실행됩니다. 실행되지 않는다면 아래의 사진처럼 마.. 2023. 3. 16.
마인크래프트 에듀케이션 에디션 소개 마인크래프트 교육용 버전이 있어? 마이크로소프트의 마인크래프트는 교육용으로 에듀케이션 에디션을 제공합니다. 마인크래프트 에듀케이션 에디션은 단순한 샌드박스 게임이 아니라 컴퓨터 소프트웨어 코딩과 전자회로 등을 익힐 수 있는 도구입니다. 서울특별시교육청에서도 마인크래프트 코딩 교육과정을 운영하고 있는 것을 보면 상당히 유용한 도구로 인정받고 있음을 알 수 있습니다. 어떤 장치에서 사용할 수 있어? 특히 마인크래프트 에듀케이션 에디션은 마이크로소프트 윈도우와 애플 맥은 물론 안드로이드(갤럭시탭), iOS(아이패드)에서도 게임 플레이가 가능하기에 장치에 제약받지 않고 언제 어디서나 사용할 수 있습니다. 누가 사용할 수 있어? 마인크래프트 에듀케이션 에디션은 협약된 교육기관에서 사용할 수 있는데 보통 학교의 전.. 2023. 3. 15.
뭐? 마인크래프트에도 코딩이 있다고? 마인크래프가 뭐야? 주변 사람에게 마인크래프트(Minecraft)에 대해 말하면 그저 스트리머 또는 유튜버, 학생들이 하는 게임으로 알고 있는 경우가 많습니다. 하지만 마인크래프트는 그렇게 단순한 게임이 아닙니다. 마인크래프트는 게임 방식과 결말이 정해지지 않은 플레이어가 스스로 자유롭게 게임방식을 정하고 진행하는 샌드박스 형식의 게임입니다. 마인크래프트는 이런 샌드박스 게임의 특징에 극한의 자유도를 구현하는 코딩(Coding)을 지원하여 플레이어가 원하는 기능을 플레이어가 추가할 수 있는 매우 창의적인 게임입니다. 마인크래프트에서 어떻게 코딩을 해? 마인크래프트의 대흥행으로 현재 마인크래프트는 여러 플랫폼에서 즐길 수 있습니다. 마인크래프트는 크게 자바 에디션(Java Edition)과 베드락 에디션(.. 2023. 3. 14.
[IT 용어] Node.js(노드닷제이에스) 정의 Node.js는 자바스크립트(Javascript)를 활용하여 서버 프로그래밍을 하기 위한 런타임(Runtime)이다. Node.js는 구글의 오픈 소스인 V8 엔진을 기반으로 작성되었다. 비동기 처리에 높은 처리성능을 보이므로 동시에 여러 입·출력이 잦은 서버 프로그램을 구현할 때 주로 활용한다. 참고문서 "노드닷제이에스, Node.js", 정보통신용어사전, 한국정보통신기술협회(TTA). @원문보기 "What is V8?", .V8 공식 홈페이지. @원문보기 "ECMAScript 2015 (ES6) and beyond", Node.js 공식 홈페이지. @원문보기 2023. 1. 10.
Node.js 에서 MySQL 8.0 에 연결할 때 "does not support authentication protocol" 오류가 발생하는 경우 오류가 발생하는 이유 Node.js에서 MySQL 패키지를 설치하는 한국어 가이드 문서를 보면 흔히 구버전 MySQL을 설명하는 가이드가 많다. MySQL이 과거에는 'mysql_native_password' 인증 프로토콜을 쓰다가 현재는 'caching_sha2_password'을 사용하고 있는데 이로인해서 MySQL 8.0에 구버전 MySQL 패키지를 사용해서 연결하는 경우 아래와 같은 경고가 뜨며 연결이 되지 않는 것을 볼 수 있다. Client does not support authentication protocol requested by server; consider upgrading MySQL client 해결 방법 이 문제를 해결하는 방법은 2가지가 있다. 첫 번째 해결 방법은 인증방식을 구.. 2022. 10. 10.
[CentOS 7] Express 방화벽 허용 Node.js의 웹 개발 프레임워크인 Express의 포트를 확인하고 방화벽 설정을 해두어야 본인이 원하는 위치에서 원활하게 접속이 가능하다. CentOS 기준으로 Express 프로젝트가 사용하는 포트를 확인하고 적절한 포트를 아래의 사진처럼 입력하면 방화벽 규칙이 추가된다. firewall-cmd --permanent --zone=public --add-port=포트번호/프로토콜 아래의 명령어를 입력하여 CentOS 방화벽 규칙을 적용한다. firewall-cmd --reload 아래의 명령어를 입력하여 적용된 CentOS 방화벽 규칙을 확인한다. firewall-cmd --list-all 다시 웹브라우저로 실행한 Express 프로그램에 접속하면 아래처럼 잘 나타나는 것을 확인할 수 있다. 2022. 9. 22.
Visual Studio Code를 Node.js의 통합개발환경(IDE)로 쓰자 Node.js를 편리하게 개발하기 위해서는 통합개발환경(Integrated Development Environment, IDE)을 구성하는 것이 필요하다. 통합개발환경으로 내가 추천하는 것은 Visual Studio Code이다. 무료로 사용가능하며 풍부한 확장 도구가 있어서 사용하기가 편리하기 때문이다. Node.js 통합개발환경을 Visual Studio Code로 구성하는 방법은 아래와 같다. 동영상 설명 2강. Visual Studio Code를 Node.js의 통합개발환경(IDE)으로 구성하자 1. Visual Studio Code 다운로드 아래의 주소로 가서 Visual Studio Code를 아래의 사진에 나타난 박스를 클릭하여 다운로드 한다. Visual Studio Code 다운로드 주소.. 2022. 8. 16.
[Windows 10] Node.js 설치하기 윈도우에서 Node.js를 설치하는 방법은 아래와 같다. 동영상 설명 1강. 윈도우에 Node.js를 설치하자 Node.js 다운로드 아래의 Node.js 다운로드 페이지로 가서 원하는 버전을 다운로드 받는다. 가장 무난하게 설치하는 방법은 설치형(.msi)을 다운받아서 설치하는 것이다. 하드웨어와 운영체제 상황에 따라 적절하게 선택하여 다운로드 받는다. 윈도우 10 64비트를 쓰는 일반적인 PC라면 아래의 PC에서 형광색으로 강조한 것을 다운로드 받으면 설치할 수 있다. Node.js 다운로드 페이지 주소: https://nodejs.org/en/download/ 필자의 경우 개발하는 환경과 운영하는 환경을 Node.js 16.15.0으로 맞췄기 때문에 아래의 주소로 가서 원하는 버전을 다운로드 받았다.. 2022. 8. 8.
[자바스크립트] img 태그의 데이터를 base64로 인코딩 하자 HTML의 img 태그의 src에 파일 경로가 아닌 데이터를 직접 넣어도 브라우저가 인식하는 시대가 왔다. 데이터를 넣을 때는 base64로 파일 데이터를 인코딩해서 넣으면 되고 다음과 같이 표현이 가능하다. BASE64로 인코딩된 img 태그 예시 위의 img 태그를 넣으면 아래와 같은 그림이 표현된다. 자바스크립트에서 기존의 이미지 파일을 base64로 인코딩하는 방법은 2가지가 있다. 하나는 HTML5 CANVAS를 이용하여 변환하는 것이고 또 다른 하나는 자바스크립트의 File API인 FileReader를 이용하여 변환하는 방법이 있다. HTML5 CANVAS를 이용하는 방법 CANVAS를 생성하고 이 CANVAS의 가로와 세로의 크기를 설정하고 그릴 것을 2D로 지정한다음 BASE64로 변호나.. 2020. 12. 27.