본문 바로가기

프로그래밍458

Fedora 37 리눅스에 구글 Chrome 브라우저 설치하기 Fedora 37에는 기본적으로 파이어폭스 브라우저가 설치되어 있습니다. 하지만 익숙한 Chrome을 설치해보겠습니다. 화면 왼쪽위의 "현재 활동"을 클릭하면 화면 하단에 대시보드(메뉴바)가 보여집니다. 이곳에서 "소프트웨어" 아이콘을 클릭합니다. "소프트웨어" 프로그램이 실행되면 오른쪽위 세개의 가로줄 아이콘을 클릭하고 팝업된 메뉴에서 "프로그램 저장소(S)"를 클릭합니다. 프로그램 저장소에서 아래쪽으로 조금 스크롤하면 "페도라 제3자 저장소" 항목이 보입니다. Fedora 37 설치시 설정에서 "서드 파티 저장소 사용"을 사용하도록 했다면 이부분이 모두 활성화 되어 있을 것입니다. 비활성화 상태라면 "새 저장소 활성"과 "google-chrome"을 활성화 합니다. 변경하려고 하면 인증이 필요하다고 .. 2023. 6. 5.
VirtualBox 가상머신 Fedora 37 Linux 메모리 확장하기 앞에서 Fedora 37 리눅스를 VirtualBox 가상머신으로 설치하여 보았습니다. 이때 주메모리와 비디오 메모리를 기본값으로 설치했다면 성능이 좀 떨어질 수 있습니다. 컴퓨터의 메모리에 여유가 있다면 가상머신의 주 메모리와 비디오 메모리를 늘려서 성능을 높일 수 있습니다. 메모리 크기를 변경하려면 가성머신의 전원이 꺼진 상태에서 해야 합니다. 켜진 상태에서는 비활성화 되어 변경할 수 없습니다. 가상머신을 선택하고 "설정(S)" 버튼을 눌러 설정창을 엽니다. 왼쪽 메뉴에서 "시스템"을 클릭하고 "마더보드(M)" 탭에서 기본 메모리를 변경합니다. 왼쪽 메뉴에서 "디스플레이"를 클릭하고 "화면(S)" 탭에서 비디오 메모리를 변경합니다. 비디오 메모리가 최대 128MB까지 밖에 선택할 수 없으면 Virtu.. 2023. 6. 5.
Fedora 37 리눅스에서 한글입력, 세벌식 자판 설정하기 Fedora 37은 기본으로 한글을 지원합니다. 설치시 한국어를 선택해서 설치하면 메뉴들이 한글로 정상적으로 보입니다. 그런데, 한글 입력이 되지 않았습니다. 뭔가 오류가 있는것 같습니다. 시스템 자판설정에는 한영 전환키가 "Super + space"로 되어 있고 이 키로 전환되는 것처럼 표시가 되기는 하는데, 한글 입력을 안되는 상황입니다. Super키는 Windows 또는 Command키를 말합니다. 찾아보니 입력기는 ibus를 사용하고 있었습니다. 우측 상단의 상태바에서 한영 표시 부분을 클릭하여 ibus설정이 가능합니다. 이 설정후에 한글이 정상적으로 입력이 되었습니다. 설정 방법을 알아보겠습니다. 한글 표시 부분을 클릭합니다. 여기서 "한국어(Hangul)"을 클릭합니다. 다시 한글 표시 부분을.. 2023. 6. 5.
VirtualBox에 Fedora 37 리눅스 설치하기 요즘 리눅스도 사용자 환경이 많이 좋아졌다는 예기를 들었습니다. 개발용으로 VirtualBox에 Fedora 37 리눅스를 설치해 봅니다. 사용해보고 현재 쓰고 있는 Windows를 대체할 수 있다고 생각되면 다음 컴퓨터를 바꿀때는 리눅스를 사용해 볼까 합니다. 그러므로 Sever가 아닌 Workstation으로 설치합니다. VirtualBox설치는 되어있는 상태에서 리눅스를 설치하는 것을 알아보겠습니다. 먼저 https://getfedora.org/ko/workstation/download/ 에서 ISO 파일을 다운로드 받습니다. 다운로드 받은 파일 이름은 Fedora-Workstation-Live-x86_64-37-1.7.iso 이고, 파일 크기는 1.89GB 정도입니다. VirtualBox를 실행하.. 2023. 6. 5.
JavaScript - 문장(Statement)과 표현식(Expression)의 차이점 JavaScript에서 문장(Statement)과 표현식(Expression)이 어떤 의미를 가지는지 알아봅니다. 아마도 다른 언어에서도 비슷한 의미로 사용될 것이라고 생각됩니다. 문장(Statement)은 프로그래밍에서 실행 가능한 최소의 코드라고 할 수 있습니다. 한 줄이 될 수도 있고, 블록({})으로 묶여 여러줄이 될 수도 있습니다. 문장의 예) let a, b; // 변수를 선언하는 문장. let c = 1; // 선언과 초기화를 한 번에 하는 문장. // 조건을 판별하는 if문장 if(a > b) { console.log("a가 b 보다 큽니다."); } a = b; // 대입 문장 c = a + b; // 계산 문장 표현식(Expression)은 주로 식별자, 연산자, 리터럴 등으로 구성되고.. 2022. 4. 19.
JavaScript - 반복문 반복문은 어떤 명령을 반복적으로 실행해야할때 사용됩니다. 자바스크립트에서는 다음과 같은 반복문을 사용할 수 있습니다. 1. for 문 2. while 문 3. do...while 문 4. 레이블, break, continue 문 5. for...in 문 6. for...of 문 1. for 문 for문은 "초기문, 조건문, 증감문"을 사용해서 반복 횟수를 지정하는 방식입니다. for([초기문]; [조건문]; [증감문]) { 문장; } // 0부터 4까지 5회 반복 for(let i = 0; i < 5; i++) { console.log("i = " + i); } // 배열 인덱스로 사용하는 방법 let arr = [ "foo", "bar", "baz" ]; for(let i = 0; i < arr.len.. 2022. 4. 12.
Boot와 React를 사용한 Simple Homepage 템플릿 설치 (2/2) 전자정부 표준프레임워크 v4, Boot와 React를 사용하는 Simple Homepage 템플릿 두 번째 프론트엔드 부분을 설치해보겠습니다. 1. 필요사항 * git : 설치참조 - https://offbyone.tistory.com/440 * Node.js : 설치참조 - https://offbyone.tistory.com/441 * Visual Studio Code : 설치참조 - https://offbyone.tistory.com/435 2. 설치하기 - 명령창을 이용해서 프로젝트를 생성할 폴더(D:\workspace\vscode)로 이동합니다. 이 폴더 아래에 프로젝트 폴더가 생성됩니다. - git을 사용해서 프로젝트를 받습니다. egovframe-template-simple-react 폴더가 .. 2022. 4. 10.
Boot와 React를 사용한 Simple Homepage 템플릿 설치 (1/2) 전자정부 표준프레임워크 v4에서 React를 사용한 템플릿이 추가되었네요. 어떤 모습인지 설치를 해보겠습니다. 테스트에 사용된 운영체제는 Windows 10입니다. React는 SPA(Single Page Application)을 만드는 프레임워크입니다. SPA는 일반적인 홈페이지와 다르게 페이지 전환이 없고, 하나의 페이지에서 모든 화면 구성요소를 자바스크립트로 만들어서 교체하는 방식으로 동작합니다. 페이지 전환이 일어나지 않으므로 화면에 표시할 데이터는 Ajax를 이용해 백엔드 서버와 주로 JSON 형식의 데이터를 주고 받습니다. SPA의 또하나의 특징으로는 사용자에게 보여지는 자바스크립트 프로그램을 사용자에게 보내주는 프론트엔드 서버와 사용자로부터 받은 데이터를 처리하는 백엔드 서버를 별도로 구성하.. 2022. 4. 9.
JavaScript - 흐름 제어와 오류처리 순차적으로 실행되는 명령을 조건에 따라 다른 명령을 실행할 수 있도록 해주는 흐름 제어(Flow Control)를 하는 방법을 알아봅니다. 1. 블록문 가장 기본적인 명령문은 세미콜론(;)으로 구분됩니다. 이러한 명령을 그룹으로 묶는 방법이 대괄호({}) 블록을 사용하는 것입니다. 블록은 함수, 조건문, 반복문, 에러처리 등에서 명령어 그룹을 묶는데 사용되어지며 변수의 유효범위를 결정하는 단위이기도 합니다. { 문장1; 문장2; . . . 문장n; } ※참고 var를 사용하면 함수 레벨 유효범위가 되고, ES6에서 추가된 let, const를 사용하면 블록 레벨 유효범위가 적용됩니다. 2. 조건문 조건에 따라 프로그램 실행 흐름를 변경할 수 있는 기능을 제공하는 명령으로 if, switch가 있습니다. .. 2022. 4. 4.
JavaScript - 문장, 식별자, 변수선언 1. 문장(Statement) 자바스크립트 문장의 끝에는 세미콜론(;)이 있어도 되고 없어도 됩니다. 하지만 한줄에 여러 문장을 적으려면 세미콜론(;)으로 구분을 해줘야 합니다. 자바스크립트는 대소문자를 구별하며 유니코드를 사용합니다. 그러므로 변수명등 식별자에 "한글"을 사용할 수 있습니다. var 좋아하는과일 = "배"; // 변수에 공백은 사용할 수 없습니다. 2. 주석 프로그램에 설명을 달 수 있습니다. // 한줄 주석 입니다. 슬래쉬 2개 이후 부터 줄 끌까지 입니다. /* 이건 여러줄 주석입니다. slash-star부터 다음 start-slash가 나올때까지가 주석입니다. */ 3. 식별자(Identifier) 변수명, 함수명, 클래스명등 식별자는 시작하는 글자가 영문자, 유니코드가 가능하며,.. 2022. 4. 1.
Node.js + TypeScript 프로젝트 만들기 자바스크립트를 공부하려다 타입스크립트를 알게 되었고, 타입스크립트를 공부하려니 간단한 테스트환경이 필요해졌습니다. Node.js는 웹브라우저가 아닌 환경에서 자바스크립트를 실행할 수 있게 해줍니다. 특히 서버 프로그램을 작성하는데 강점이 있다고 하더군요. 타입스크립트를 연습해보기 위한 간단한 환경이 될 수 있겠다 싶어서 Windows에서 Node.js와 TypeScript를 사용하는 프로그램을 위한 개발환경을 만들어 봅니다. 에디터는 Visual Studio Code(이하 vscode)를 사용하려고 합니다. ※ 작업환경은 다음과 같습니다. - Windows 10 Pro 64bit - Node.js v16.14.1 LTS : 설치 참조 - https://offbyone.tistory.com/441 - ya.. 2022. 3. 23.
TypeScript를 사용하는 React App 만들기(feat. yarn berry) React와 TypeScript를 공부하는 첫 단계로 패키지 관리자 yarn을 사용해 프로젝트를 생성해 보았습니다(yarn 이외에 npm, npx를 이용한 프로젝트 생성 방법도 있습니다). 처음의 목표는 yarn berry(yarn v2)를 global로 설치를 해서 yarn classic(yarn v1)없이 바로 yarn berry + react + typescript 프로젝트를 생성하는 것이었습니다. 하지만 생성된 프로젝트는 실행시 오류가 너무 많이 떠서 포기 하였습니다. 다음으로 선택한 방법이 yarn classic으로 프로젝트를 생성한 다음에 yarn berry로 마이그레이션하고, PnP(플러그앤플레이)설정과 Zeor-Install 설정까지 하는 것이었습니다. 결론부터 말하자면 yarn berry.. 2022. 3. 20.
Node.js 패키지 관리자 yarn 설치하기 Node.js의 패키지 관리자 yarn을 설치해 봅니다. Node.js를 설치하면 기본적으로 npm 이라는 패키지 관리자가 포함되어 있습니다. yarn은 npm보다 성능과 보안성을 높였다고 합니다. 하지만 이것저것 찾아보니 npm 또한 개선이 많이 되어서 성능은 거의 비슷해지고, 보안쪽도 개선이 되었다고 합니다. 처음 접해보는 입장에서 어느것이 더 나은지 판단이 되지 않습니다. yarn을 사용하는 예제가 종종 보이고, yarn을 사용하길 권장하는 모듈도 보이는지라 필요할때 필요한 것을 사용하면 될것 같습니다. 먼저 Node.js가 설치되어 있어야 합니다. 필요하면 https://offbyone.tistory.com/441 를 참고 해서 설치하면 되겠습니다. yarn의 공식 홈페이지는 https://yar.. 2022. 3. 18.
Node.js 설치하기 Node.js는 Javascript로 작성된 프로그램을 운영체제상에서 일반 애플리케이션 프로그램처럼 실행시켜주는 런타임입니다. 특히, 서버 프로그램을 작성하는데 많이 사용되고 있는것 같습니다. React를 사용해보기 위해서 설치해 봅니다. Node.js 한글 사이트는 https://nodejs.org/ko/ 입니다. 설치 파일을 다운로드 받습니다. 현재 최신 버전은 17.7.1이네요. 저는 16.14.1 LTS 버전은 다운받아 설치합니다(LTS는 Long Term Support의 약자로 오랫동안 지원하는 버전을 말합니다). 다운로드 받은 파일은 node-v16.14.1-x64.msi 이고, 크기는 27.1MB 정도 입니다. 다운받은 파일을 더블클릭하여 설치합니다. 라이센스에 동의합니다. 설치 위치를 지정.. 2022. 3. 17.
git 설치하기 소프트웨어 형상관리 툴인 git을 설치해 봅니다. svn을 주로 사용하고 있지만, git이 더 성능이 좋다고 하니 배워두려고 합니다. https://git-scm.com/ 에서 자신의 시스템에 맞는 파일을 다운 받습니다. 이글에서는 Windows용을 설치합니다. 현재 버전은 2.35.1이네요. 다음로드 페이지에서 64-bit 윈도우즈용 설치 파일을 다운로드 받습니다. 파일명은 Git-2.35.1.2-64-bit.exe이고, 파일 용량은 47.9MB 정도 입니다. 설치파일을 더블클릭하여 설치합니다. 설치 위치를 지정합니다. 기본은 C:\Program Files\Git 이지만, 원하는 곳으로 바꾸면 됩니다. 설치할 컴포넌트를 선택합니다. 여기서는 기본값을 사용하겠습니다. 시작메뉴 폴더를 선택합니다. 기본을 .. 2022. 3. 16.