i-mini

React란, Web-App을 쉽게 만들 수 있는 웹 프레임워크 이며, JavaScript 라이브러리 입니다. JavaScript 언어에 대한 기본적인 이해가 도움이 됩니다 :) 1. NodeJs 설치하기 홈페이지에 방문해서 지금 가장 최신버전의 NodeJs를 설치합니다 :) 저는 MacOS를 사용하기 때문에 macOS용 안정화 버전을 다운받아 설치했습니다. 아래 캡쳐 화면처럼 버전을 확인하여 최신 버전인지 확인해줍시다! node -v 2. React App 생성 React 설치 후 아래 명령어 세개를 순서대로 입력합니다. npx create-react-app my-app cd my-app npm start

브라우저의 동작방식은 원래는 개발자 몫이 아닌, 브라우저만의 영역이었습니다. 최근에는 개발자도 브라우저 렌더링을 이해해야 하는 추세입니다. 왜냐, 속도를 높이기 위해서죵~^.^ 브라우저란? 브라우저는 사용자가 서버에 요청한 내용을 받아 사용자가 볼 수 있도록 표시하는 역할을 합니다. 브라우저는 서버로부터 받아온 HTML파일을 해석해서 우리가 항상 사용하는 그런 웹페이지가 되는것입니다! 브라우저의 기본 구조 우리가 자주 사용하는 웹브라우저는 Google Chrome, IE, Safari 등이 있고 조금씩은 다르지만 브라우저의 주요 구성요소는 아래와 같습니다. User Interface: 주소 표시줄, 이전/다음 버튼, 북마크 등 사용자가 보는 화면 Browser Engine: 사용자 인터페이스와 렌더링 엔..

프론트엔드? Front-end. 웹 프로그래밍의 한 분야. 반대말은 백엔드. 프론트엔드 개발자는 프론트엔드, 백엔드의 완전한 분리 구조를 지향하는 업무 스타일의 개발 방식으로써 프론트단의 비지니스 로직과 사용자 영역의 개발을 담당하는 사람이다. 이와 다른 방식의 업무 스타일 직군으로는 웹퍼블리셔(ui개발)와 개발자(서버 개발자)의 업무 분리 방식이 있다. 이 경우는 주로 서버사이드가 클라이언트를 감싸는 방식이다. MVC로 치면 View 부분에 해당하는 영역을 맡는다. - 출처 나무위키 그렇죠, 정의 된 것 처럼 프론트엔드는 개발자가 아닌 사람들이 가장 많이 접하는 그 웹페이지!! 사용자 인터페이스 부분을 말합니다. 프론트엔드 개발자로 일하기 위해서는 JavaScript, CSS, HTML 을 다룰 줄 알..

1. Apache Tomcat 다운로드 공식홈페이지에서 Apache Tomcat을 다운로드 합니다. (코어 바이너리, tar.gz) 2. Apache Tomcat 설치 아래의 명령어를 순서대로 실행합니다! # Apache Tomcat을 다운받은 경로에서 /usr/local 경로로 압축 해제 sudo tar -xzvf apache-tomcat-8.5.65.tar.gz -C /usr/local/apache-tomcat-8.5.65 # Library 경로에 Tomcat 심볼릭 링크 추가 sudo ln -s /usr/local/ /Library/Tomcat # Tomcat 설치 디렉토리 및 파일 소유자 변경 sudo chown -R /Library/Tomcat # Tomcat 실행/종료 스크립트의 실행 권한 추..

DOM ( Document Object Model) 이란? 문서 객체 모델이라고 하며 HTML XML 문서를 Javascript에서 접근할 수 있도록 Object화 해주는 기술을 말합니다. 웹페이지는 하나의 문서(Document)입니다. 웹페에지의 구조를 Object로 만들어 JavaScript에서 내용을 변경하고, 저장하는 등의 조작이 가능해집니다. 즉, DOM을 사용하게 되면, HTML 에 프로그래밍 방식으로 접근할 수 있게 되는거죠! 우리의 웹 브라우저는 HTML페이지를 서버에서 받아온 후, HTML을 로드할때 DOM을 함께 생성합니다. 이렇게 되면, DOM이 HTML과 Javascript간의 인터페이스 (소통창구) 역할을 하게 되는거죠. 그래서 DOM 기술로 우리는 동적 웹페이지를 만들 수 있습니..

자바스크립트에서 함수는 기본 구성 블록중 하나로, 작업을 수행하거나 값을 계산하는 재사용가능한 문장 집합입니다. 함수도 일반 객체(데이터 타입)로, 이전 포스팅에서 작성했던 Object와 같은 개념입니다. 예를들어, 변수의 값을 화면에 출력할때 많이 사용하는 console.log도 console 객체에 들어있는 log 함수입니다. console.log(console) /* 실행 결과 ----------------------------------- Object [console] { log: [Function: log], warn: [Function: warn], dir: [Function: dir], time: [Function: time], timeEnd: [Function: timeEnd], timeL..

자바스크립트는 동적언어로 변수 타입을 미리 선언할 필요가 없습니다. 어떤 데이터 타입이 있는지 한번 확인해봅니다.🤗 1. 기본 자료형 1) Boolean - true/false 두가지 값을 가질 수 있습니다. - 프로그래밍 시 논리적으로 참/거짓을 판단할 필요가 있을때 사용합니다. - 예) 사용자가 입력한 값이 10 이상이면 참, 아니면 거짓 (비교연산자) const boolT = true; const boolF = false; console.log(boolT,boolF); /* 실행 결과 =============================== true false =============================== */ 2) Null - 변수값이 비어있다는 표기를 하기 위한 자료형입니다. - un..

JavaScript를 이제 막 시작한 자바린이로써, 나중에 다시 찾아볼 수 있도록 정리한 포스팅입니다. 😂 1. 변수 선언 방법 변수 선언문 재선언 재할당 특징 let 불가 가능 - 블록 레벨 스코프 - ECMA2015 버전부터 사용 가능 const (constant(상수)) 불가 불가 - 변수 선언시 값을 반드시 같이 넣어줘야 함 - 블록 레벨 스코프 - ECMA2015 버전부터 사용 가능 var (variables(변수)) 가능 가능 - 전부 가능 (자유도 높음) 1) let 변수를 선언하고 값을 바꿔봅니다. let tomato tomato = "맛있어"; console.log(tomato); tomato = "빨간색"; console.log(tomato); /* 실행 결과 --------------..

야무지게 설치하고 Nodejs와 연동하려고 하니까 바로 뙇 에러가 나오네요...😭😭😭😭😂 1. 샘플 코드 사용한 코드는 아래와 같습니다. (예제 링크) // test-mysql.js 파일 var mysql = require('mysql'); var connection = mysql.createConnection({ host : 'host-IP', user : 'root', password : 'Xptmxm1212!@', database : 'my-Database' }); connection.connect(); connection.query('select * from sample_table', function (error, results, fields) { if (error){ console.log(err..

안녕하세요 🙋 🙋‍♀️ MySQL을 처음 설치하고, 외부에서 접속해보려고 하면 이런 에러가 나옵니다. mysql -h -u root -p MySQL은 기본적으로 로컬(Localhost)에서만 접속이 허용됩니다. MySQL 사용자를 살펴볼까요? mysql> SELECT Host,User,plugin,authentication_string FROM mysql.user; 유저가 다 "localhost"로 표시되어있습니다. 이 경우, 외부에서부터의 접속이 불가능 합니다. 그래서 이번 시간에서는 외부에서 접속할 수 있도록 계정을 설정해보도록 하겠습니다. :) * 주의 * 이번 포스팅에서는 Root계정을 변경하지만, 보안 상 Root계정 외 별도의 계정을 만들어 사용하기를 권장합니다. 먼저, 사용자를 생성합니다 :..