Java 설치하기Java는 현재 많이 사용되는 언어 중 하나이다.이를 설치하기 위해서는 아래의 링크를 통해서 설치하면 된다. 더 읽기
Router 을 설명하기 앞서서React에서의 Page 이동을 한 마디로 표현 하자면, 빨간색 레고블럭을 뜯고 파란색 레고블럭으로 변경한다라는 의미이다.이를 정확하게 알기 위해서는 Component라는 개념을 먼저 숙지를 하고 있으면 매우 좋다. React에서 한 페이지를 표현 할 수 있는 것을 Component라고 부른다.Component는 독립적이며, Component 하나가 하나의 React 코드이자, 이 하나로 하나의 페이지를 표현이 가능하다.그런 이를 한 개의 소스코드라고 가정할 때, 이러한 Component들이 모여서 하나의 페이지를 이룬다. 그러면 하나의 페이지를 이루기 위해서 최소 1개의 Component에서 여러개의 Component들의 집합이 형성 되었다.그렇..
AXIOS으로 파일 보내기 axios로 파일을 보내기 위해서는 간단하게 알아야 할 것이 있다. FormData라는 객체이다. Object처럼 Key와 Value로 이루어져 있지만, 데이터를 넣는 방법은 append를 이용해야 한다. let formData = new FormData(); console.log(formData); formData.append('input', this.inputText); formData.append('inputFile', document.getElementById('input File ID').files[0]); 여기서 중요한 점은 FILE을 formData안에 append 한다는 부분이다. try { axios.post('http://localhost:3000/fileIn..
반복 되는 하루 속에서 아주 자그만한 것이 계기가 되어 거제시 까지 가게 되었다. 그 계기는 아주 사소할 수 있어도, 바쁜 일상 속에서의 스트레스를 탈출하고픈 마음이 서울로 부터 멀리 갈 수 있는 힘을 싣는다. 첫 번째 여행의 도착지는 거제의 천상의 섬이라고 불리우는 거제시 외도, 보타니아이다. 자그만 섬인 줄 알았던 그곳은 놀랍게도 섬 하나가 하나의 정원이자 놀이터였다. 무인도를 정원으로 가꾼 것인지, 이 섬은 항상 관광객들을 반긴다. 바닷가를 바라보면 다른 항구에서 출발한 배들이 모여들고 선착장은 사람들로 붐빈다. 이곳의 시작은 정말 혼잡스럽다. 비 오는 날씨에도 사람이 이렇게 많다면, 맑은 날씨는 오죽할까 싶기도 하지만 비오는 날씨라서 오히려 이쁜 사진이 잘 나오는 듯한 그림도 연출된다. 이는 마치..
ROWNUM ORACLE의 테이블 내용에 순번을 출력하기 위해 사용하는 가상컬럼 중 하나입니다. 테이블의 SELECT문 출력 할 때, 순번이 필요할 때 주로 이용합니다. 특히 DB 관리자 및 관계자 외에 SEQUENCE가 보통 NUMBER로 순번을 나타낼 때가 있지만, 이를 감추기 위해 사용하거나 혹은 일반사람들이 이용하는 게시판의 순번을 알리기 위해서도 사용되기도 합니다. 🏁 순번을 사용하는 이유 🖊️ 중요한 PK를 감추기 위해서 🖊️ 순번을 테이블로 보관할 경우, 중간의 정보가 삭제될 경우 순번이 띄어 넘는 문제가 발생됩니다. 이를 방지하기 위함. ORACLE에서 ROWNUM 기본 사용 방법 ROWNUM은 ORACLE에서 사용하는 가상화 컬럼 중 하나입니다. ROWNUM의 사용방법은 먼저 크게 두 가..
SQL 접속 오류 ORACLE을 설치하고 나서, sql plus로 제대로 된 설치를 확인하는 과정이다. 초기 패스워드로 접속해 보았지만, 제대로 된 실행이 되지 않는 모습이다. 이를 위해서 여러 해결 방법을 조사하는 도중 쉽게 해결할 수 있는 방법을 찾았다. 원인은 설치 후 혹은 OS부팅 후 Oracle이 제대로 실행 되지 않은 원인이다. 즉, oracle을 시작하면 된다. Window에서 Oracle 실행하기 시작의 실행에서 service 혹은 서비스 검색을 해본다. 서비스에서 Oracle 실행 여부 확인해보기 Window 화면에서 Oracle이 실행여부를 확인해 보자. 만약, 이 부분이 실행이 안 되어 있다면, 마우스 우클릭으로 실행을 확인해 보면 된다. 🎶 서비스에서 목록을 찾기 어려 울 때, 찾고..
COALESCE 설명 NULL을 사용하지 않기 위해 사용하는 함수이다. 해당 함수를 사용하기 위해서는 최소 2개의 값이 필요하다. COLAESCE 사용할 때, 괄호 안의 값은 최소 2개여야 한다. 행을 위에서 부터 아래로 읽을 때, 해당 컬럼이 NULL 일 경우, NULL 대신 사용 문자가 표시되는 원리이다. COALESCE 사용하기 해당 테이블은 4개의 행을 가진 테이블이다. 이 테이블의 값을 활용하여, 함수의 테스트를 진행할 예정이다. COALESCE(컬럼명1, NULL 대신 사용 문자) SELECT COALESCE(COL2, 'NULL 체크') FROM TB_BLUE; COL2가 NULL인 값이 'NULL 체크'로 대신 값이 나온 것을 확인할 수 있다. NULL 체크 함수인 것을 확인 할 수 있다...
IN에 대한 설명 SELECT * FROM [테이블 명] WHERE 컬럼명 IN ('조건 값 1', '조건 값 2'); equals('=')과 비슷하지만 or의 개념과 유사하다고 할 수 있다. 해당 테이블 내의 검색하고자 하는 컬럼의 값을 2개 이상 조회 할 때 이용하는 연산자이다. '조건값 1'과 '조건 값 2' 중 하나라도 포함이 되면 true가 된다. 실험 대상의 TABLE 더보기 CREATE TABLE create table TB_RED ( RED_COL1 int auto_increment, RED_COL2 int , RED_COL3 VARCHAR(30) , CONSTRAINT TB_RED_pk PRIMARY KEY (RED_COL1) ) comment '첫 번째 테이블'; 실험에 참가 된 테이블..
문자열 Java에서 String 타입형을 사용하여 나타내는 변수를 뜻합니다. String은 자료형에 속하지는 않지만, 가장 많이 사용하는 변수타입 중 하나입니다. 우리는 이를 이용하여 문장을 꾸미려고 합니다. 좋은 인용문 하나를 도용하여 만들어보게 되었습니다. 이 문장을 갖고 테스트를 진행해 보도록 하겠습니다. 문자열 변환하기 1. 문자열 대, 소문자 변환 method comment .toUpperCase() 문자열을 모두 대문자로 변환한다. .toLowerCase() 문자열을 모두 소문자로 변환한다. 대, 소문자로 변환하기 위해서는 다음과 같은 함수를 사용합니다. 해당 함수를 통해서 변수안의 값이 모두 대, 소문자로 변경된 것을 확인할 수 있었습니다. 2. 문자열 안의 문장 찾기 type comment..
정수 자료형 type memory size 범위 byte 1 byte -128 ~ 127 short 2 byte -32,768 ~ 32,767 int 4 byte -2,147,483,648 ~ 2,147,483,647 long 8 byte -9,223,372,036,854,775,808 ~ 9,223,372,036,854,775,807 각 정수마다 표현할 수 있는 정수의 크기가 존재합니다. 옛날에는 한정된 하드의 공간을 확보하기 위해 많은 것을 따졌지만, 현재에는 고사양 된 PC에 따라서 int를 기본으로 사용하고 있습니다. ✔️ long을 사용할 때는 값 뒤에 L을 붙여야 한다. ✔️ 소문자 'l'도 사용할 수 있지만, 숫자 '1'과 구분하기가 어려워 'L' 사용을 지향한다. 2진수, 8진수, 16진수..
시작하기 전에 알아두면 좋은 기초지식 JavaScript - Object 만들기 2023.06.01 - [Web/JavaScript] - [JavaScript] Object 만들기 [JavaScript] Object 만들기 JavaScript, Object 만들기 Object 만들기 Object란, 하나의 변수 안에 여러 개의 값을 담는 것을 뜻 한다. 보통 Java에서 유명한 dataType은 String 혹은 int(number)가 있다. 이들은 각각 하나의 변수 안에 하나의 mollangpiu.tistory.com CallBack 함수 배우기 전 CallBack 함수를 알기 전에 JavaScript의 실행순서에 대해서 먼저 짚고 넘어가야 합니다. 또한 이를 온전히 사용하기 위해서는 JavaScrip..
Error 상황 리엑트 프로젝트 생성 명령어를 입력했지만, ERROR가 발생되면서 실행이 되지 않는 상황이다. 이럴 때는 기존의 갖고 있는 npm에서 문제가 발생했을 수도 있으니 그 부분부터 먼저 살펴봐야 한다. 📃 대처방법 ✔️ 대안 1 기존의 npm을 지웠다가 다시 설치한다. # 기존 npm 삭제하기 npm uninstall -g create-react-app # npm 설치하기 npm install -g create-react-app # 프로젝트 다시 생성하기 npx create-react-app [프로젝트명] 기존의 npm의 create-react-app를 삭제하고 다시 설치하는 방법이다. npm의 create-react-app가 문제가 생길 경우 설치가 안 될 수도 있다. ✔️ 대안 2 관리자모..
프로젝트 만들기 프로젝트를 만들 때, 내 프로젝트 위치를 먼저 정의한다. 필자는 D드라이브 안의 Project명을 정의하였다. 프로젝트 저장경로는 가급적 한글이 없는 것을 추천한다. 그러면 나의 프로젝트 저장위치의 폴더에서 Shift + 마우스 우클릭을 하게 되면, 설치한 PowerShell창 열기가 작성된다. npx create-react-app [프로젝트명] 프로젝트 설치 명령어를 작성하면 끝. 나의 프로젝트 파일을 불러왔을 때, 이렇게 src, App.js가 있으면 정상적으로 완료된 것이다. 만약 해당 파일이 없을 때는 project 생성 명령어를 다시 입력해야 한다. project 생성시 Error 발생할 경우 2023.11.12 - [Web/React] - [React] npx create-ap..
React 설치 전 React를 설치하기 전, 필요한 것에 대해서 먼저 설치를 진행하려고 한다. 단순하게 React설치하기 위한 또는 향후 React프로젝트하는 도중 lib 설치를 하기 위한 단계이기도 하다. 이 부분에 대해서 문제가 없다고하면 그냥 넘어가도 된다. Node 설치하기 먼저 Node를 설치해야 한다. Node.js는 Google에서 'node' 검색만 해도 쉽게 나온다. https://nodejs.org/en Node.js nodejs.org 혹은 링크를 통해서 받으면 된다. 버전 상관없이, 가급적이면 왼쪽 LTS로 받는 것을 추천한다. PowerShell 설치하기 2023.11.08 - [Computer/기타] - PowerShell 설치하기 PowerShell 설치하기 링크 https:..
사용하기 전에 알아두면 좋은 글 React, props 사용방법 2023.11.11 - [Web/React] - [React] props 사용하기 [React] props 사용하기 앞의 설명한 사용자정의 Component에 값을 전달하는 방법 중 하나이다. 이 부분을 이해하기 위해서는 다음 글을 이해하는 것을 추천한다. React, 사용자정의 Component 2023.11.11 - [Web/React] - [React] 사용자 mollangpiu.tistory.com React, 사용자정의 Component 2023.11.11 - [Web/React] - [React] 사용자 정의 Component 만들기 [React] 사용자 정의 Component 만들기 Component 💡 재사용이 가능한 각각의 ..
앞의 설명한 사용자정의 Component에 값을 전달하는 방법 중 하나이다. 이 부분을 이해하기 위해서는 다음 글을 이해하는 것을 추천한다. React, 사용자정의 Component 2023.11.11 - [Web/React] - [React] 사용자 정의 Component 만들기 [React] 사용자 정의 Component 만들기 Component 💡 재사용이 가능한 각각의 독립된 모듈. 웹 컴포넌트는 W3C에서 새로 정의가 되었으며 보통 Header, Footer등 각 영역을 담당하기도 한다. 대표적으로 Header, Nav, Aside, Footer 등이 있다. 사용방 mollangpiu.tistory.com JavaScript, Object 이해하기 2023.06.01 - [Web/JavaScri..
Component 💡 재사용이 가능한 각각의 독립된 모듈. 웹 컴포넌트는 W3C에서 새로 정의가 되었으며 보통 Header, Footer등 각 영역을 담당하기도 한다. 대표적으로 Header, Nav, Aside, Footer 등이 있다. 사용방법은 첫글자는 반드시 대문자로 시작되며, 해당 영역만 재사용을 목적이다. import logo from './logo.svg'; import './App.css'; function App() { return ( ); } function Modal() { return test 입니다. } export default App; 여기서 우리가 확인해야 할 것은 Modal이라는 함수 사용이다. 사용자 Component를 만드는 방법은 매우 단순하다. function을 통해..
화면 여기에 Button '버튼' 하나만 있는 화면이 있다. 저 화면을 누를 경우, JavaScript에서 Object를 생성할 것이고, 그 Object가 console창에 log를 남기게 된다. log의 내용은 다음과 같다. Object 변수에는 객체에 'a'에는 '몰라', 'b'에는 '피노키오'를 담았다. 그리고 test라는 Object를 또 하나를 생성하게 되는데, 여기에는 기존의 Object를 담게 된다. test는 Object의 변수에서 값을 가져왔기 때문에 Object의 내용과 일치하게 된다. 그리고 test에서 'a'의 키를 변경했을 때, Object의 변화를 알아보는 실험이다. 변경은 test 변수에서 했기 때문에 Object에서는 변화가 있어서는 안 된다. 그러나 Object 또한 tes..
링크 https://github.com/PowerShell/PowerShell/releases/tag/v7.3.9 Release v7.3.9 Release of PowerShell · PowerShell/PowerShell 7.3.9 - 2023-10-26 Build and Packaging Improvements Bump .NET 7 to version 7.0.403 Use correct agent pool for downloading from Azure blob Remove a timeout value from ADO pipeline stage to resol... github.com 2023년 11월 8일 기준, git에 올라온 설치파일을 확인할 수 있었습니다. 설치 방법 Git에 올라온 설치파일은..
모바일 개발의 시작 모바일 개발을 위해서 여러 가지 생각할 것이 많았다. 기획, DB, UI, 편의성 등 개발을 한 번쯤 했다면 생각해 봤을 것들이다. 그중, 이번 안드로이드 개발에서 가장 생각이 힘들었던 것은 DB였다. 사용의 편의성은 좋아야 하지만, 서버운영에 대한 생각이 없었기 때문이었다. 서버의 필요성이 없다는 것은 기능을 대부분 포기한다는 것과 같았다. 이를 해결하고자, 좋은 모바일을 개발하고자 아래와 같이 나열하게 되었다. Native APP 💡 어플개발의 가장 기본이다. 일반적인 애플리케이션을 의미 모바일기기에 최적화된 언어로 개발되며 안드로이드는 JAVA와 KOTLIN으로 개발되며 IOS의 경우 SDK를 이용하여 Swift로 만드는 방식이다. 대부분의 앱이 이를 통해서 만들어진다. 💯 장점..