공영재의 개발일지

군 장병 SW/AI 교육 진행 시 클라우드 IDE인 goormIDE를 사용합니다. 학습 내용을 기록하기 위해 Github와 연동하는 방법을 알아보겠습니다. goormIDE에 들어가서 컨테이너를 생성 후 실행합니다. 컨테이너 OS의 기본값은 Ubuntu 18.04를 사용합니다. 사실상 CloudIDE에 한정된 것이 아닌 Ubuntu 환경에서의 Git 연동방법이라 보셔도 됩니다. 먼저 컨테이너 실행 후 터미널에서 아래와 같은 명령어로 Git을 설치합니다. sudo apt-get install git 설치가 완료되면 디렉토리를 만들고 해당 디렉토리로 이동한 뒤 git init을 실행합니다. 그 뒤 계정 정보를 입력하기 위해 아래와 같은 명령어를 실행합니다. sudo git config --global user..

먼저 callback 함수를 살펴보겠습니다. callback을 알아보기전, 우선 함수의 실행 순서를 알아야합니다. 프로그래밍엔 동기와 비동기라는 개념이 있습니다. 동기(Synchronous)는 실행 순서가 순차적인 반면, 비동기(Asynchronous)는 실행 순서가 보장되지 않습니다. 즉, 이전 함수의 실행이 마무리되지 않더라도 다음 함수가 실행될 수 있습니다. Javascript는 웹 상에서 동작하는 경우가 많아 효율성을 위해 비동기적으로 코드가 실행됩니다. 하지만 코딩을 할 땐 실행 순서가 지켜져야 하는 경우가 많습니다. 그럴 때 순서를 정해줄 수 있는 것이 바로 callback 함수입니다. callback 함수는 다음과 같이 사용합니다. callback이 없었다고 가정하면, first()의 set..

AWS란 Amazon Web Service의 약자로, 개발자라면 다들 들어보셨을 클라우드 플랫폼입니다. 저 역시 개발한 서비스를 배포할 때 유용하게 사용했던 적이 있습니다. EC2를 통한 클라우드 컴퓨팅, S3를 통한 스토리지 서비스, Amplify를 통한 손쉬운 배포 등 수많은 클라우드 서비스를 제공하고 있기에 점유율도 상당히 높습니다. 이러한 AWS는 첫 가입 시 1년간 프리 티어, 즉 특정 용량만큼 서비스를 무료 제공하고 있습니다. 저는 군 내 사지방에서 가벼운 수준의 코드로 AWS 서비스를 이용할 것이기에 새로운 프리티어 계정을 생성해보겠습니다. 먼저 AWS 홈페이지에 들어가 무료 계정 생성을 클릭합니다. 그 후 아래와 같은 화면이 뜨면 계정 복구 및 메일 인증용 이메일과 AWS용 이메일을 각각 ..

Javascript의 ES(ECMAScript)는 표준 규격이자 버전이라고도 할 수 있습니다. 자바스크립트는 ES6(2015년) 이후로 매년 새로운 ECMAScript를 발표하고 있습니다. 현재는 ES13까지 나온 상태이지만, ES6이 주목받고 유명한 이유는 이전 버전(ES5)에서 해결하지 못했던 많은 문제를 해결하였고 가독성과 유지보수성을 향상시킬 새로운 기능이 혁명적이게 등장했기 때문입니다. 추가로, React나 Vue와 같이 유명한 라이브러리도 ES6에 맞춰 지원되고 또한 대부분의 브라우저에서 호환된다는 점도 있습니다. 쉽게 말해 ES6까지만 알아도, 웬만한 모든 서비스를 문제없이 만들 수 있다는 것입니다. 이번 글에서는 ES6부터 새로 추가된 문법 중 중요한 내용들에 대해 알아보겠습니다. 1. c..

웹을 구성하는 요소에는 HTML, CSS, 그리고 Javascript가 있습니다. HTML이 웹의 뼈대를 세우고, CSS가 내용을 꾸미며, Javascript가 동작을 완성합니다. 그중에서 가장 각광받고 있는 프로그래밍 언어인 Javascript에 대해 알아보겠습니다. 자바스크립트를 구글에 검색하면 객체 기반의 스크립트 프로그래밍 언어라고 설명합니다. 키포인트는 객체 기반과 스크립트 언어라는 점입니다. 먼저 객체 기반에 대해 파헤쳐 보겠습니다. C++이나 Java를 공부해보셨다면 객체 지향이라는 말을 들어보셨을텐데요. 일의 진행 순서대로 프로그래밍하는 절차 지향 프로그래밍과 다르게 클래스를 통해 객체를 만들고 이 객체들간의 상호작용으로 프로그래밍 하는 방식을 의미합니다. 하지만 C++, Java와 달리 ..

프론트엔드 공부를 처음 시작한다면 가장 많이 볼 수 있는 용어이자 질문입니다. React와 Vue, Angular는 각각 무엇이며 그 차이점은 무엇일지에 대해 알아보겠습니다. ※ 후술하겠지만 Vue와 Angular는 프레임워크인 반면 React는 라이브러리입니다. 프론트엔드를 공부하기 전 두 개념의 차이부터 명확히 해야 합니다. 프레임워크와 라이브러리의 차이는 개발자가 어느 단에서 제어를 하는가입니다. 프레임워크는 누군가가 만들어놓은 프레임워크라는 틀 안에서 개발자가 작성한 코드가 수동적으로 동작합니다. 따라서 "제어 흐름이 프레임워크에 있다" 고 볼 수 있습니다. 예시로 앱에서의 Android, Java의 Spring, 웹 개발의 Vue, Angular가 있습니다. 라이브러리는 특정 기능이 필요할 때,..

CSS를 통해 예쁘게 꾸며놓은 블로그는 저에게 포스팅할 동기를 부여해주고 방문자에게도 좋은 인상을 남겨줄 수 있습니다. 추가적으로 프론트엔드 능력을 어필할 때도 활용할 수 있을 것 같습니다. 오늘은 티스토리 블로그 꾸미기 - 썸네일 애니메이션 적용 방법에 대해 알아보겠습니다. 이번에 적용하고자 할 것은 썸네일에 마우스 오버 시 애니메이션이 발생하도록 하는 것입니다. 그러기 위해 우선 썸네일의 태그를 알아야 합니다. 블로그에서 F12(개발자 도구)를 누른 뒤 아래 그림과 같이 좌측 상단을 클릭하여 element 선택 상태를 활성화합니다. (혹은 ctrl + shift + c 단축키) 그 후 아래와 같이 블로그 홈에서 썸네일을 클릭하면 해당 element의 class 명과 태그 위치를 확인하실 수 있습니다...

[군장병 SW/AI 역량 강화 교육] 이란 디지털 인재 양성을 위해 민 - 군 - 관이 함께하여 만든 군 장병들을 위한 IT 교육 프로그램입니다. 2022년 올해 처음 시행되는 사업인데요. 국방부, 과학기술정보통신부, 카카오엔터프라이즈와 엘리스 등의 유수의 기업이 참여하였습니다. 저는 그중에서 카카오엔터프라이즈와 스타트업 구름이 협력하여 주최한 JS 웹 개발 프로그램에 참여하고 있습니다. 구름은 SW 스타트업으로, 이 프로그램을 진행하기 전부터 알고 있었습니다. 싸지방에서 코딩 공부를 진행하기가 어렵기에 어떻게 할까 고민하던 중 EC2나 GCP를 활용하여 code-server를 사용하는 방법과 클라우드 IDE를 활용하여 개발하는 방법을 고민했는데, 그때 클라우드 IDE로 국내에서 가장 유명한 기업이 바로..

저는 2022년 기준 TOD병으로 복무하고 있는 현역 군인입니다. TOD병에 관한 정보나 후기가 부족한 것 같아 알고 있는 선에서 정보를 공유하고자 합니다. 여러 사단/군단에 선배나 동기가 TOD병과로 입대하였기에 최대한 객관적으로 서술하겠습니다. 먼저 TOD병은 장비를 이용해 적을 감시하는 일을 합니다. TOD란 열상감시장비의 약자로 이를 통해 주/야간 관계없이 감시 임무를 수행할 수 있습니다. 보다 자세한 임무는 군사 보안적 사유로 말하지 못하는 점 양해부탁드립니다. TOD병과는 모집병으로 직접 신청할 수도 있고, 징집병으로 와서 논산훈련소나 사단 신병교육대에서 뽑혀갈 수도 있습니다. 모집병으로 신청하실 경우 경기도 이천시에 위치한 정보교라 불리는 학교와 같은 곳에서 2주동안 추가로 후반기 교육을 받..

2021년 한 해 동안 창업을 하며 많은 것을 배우고 느꼈으나 올해 군 입대를 하며 그 기억이 서서히 희미해져 갔습니다. 당시 배운 점들과 그 감정들을 잊지 않기 위해, 블로그를 통해 느낀 바를 상기시키고자 합니다. 1편은 여기서 보실 수 있습니다. https://yeongjaekong.tistory.com/m/7 대학생 스타트업 회고 (1) 2021년 한해동안 창업을 하며 많은 것을 배우고 느꼈으나 올해 군 입대를 하며 그 기억이 서서히 희미해져 갔습니다. 당시 배운점들과 그 감정들을 잊지 않기 위해, 블로그를 통해 느낀 바를 상기 yeongjaekong.tistory.com 새로운 시작 예비창업패키지는 떨어졌지만, 학교에서 지원해주는 DGIST DSA 프로그램을 통해 사무실을 지원받고 새로운 마음가짐..