본문 바로가기

개발바닥

(27)
Deno에 대해서 알아보자 안녕하세요 Devport 입니다. 이번 포스팅에서는 Deno에 대해서 알아보도록 하겠습니다. Deno? Deno는 node.js를 창립자인 라이언달에 의해서 만들어졌습니다. 라이언 달은 node.js를 만들면서 아쉬웠던 부분들과 Deno에 대하여 JsConf 2018에서 "10 Things | Regret About Node.js"에서 이야기를 하였죠. 라이언달이 말했던 10가지의 아쉬웠던 부분들은 무엇이 있을까요? Promise를 고집하지 못했던점. 보안문제 GN으로 빌드 시스템을 업데이트 하지 못한 부분 빌드시스템에 C++대신 FFI를 제공하지 못한점 package.json으로 인하여 Npm에 대한 의존도가 높아진점 모듈 시스템에 폴더화로 인하여 파일이 증가한점 node_modules 구조로 인하여 ..
라즈베리파이 - OpenMediaVault 5 설치하기 안녕하세요 devport 입니다. 이번시간에는 지난번 포스팅에서 라즈비안을 설치를 했었는데요. 그 환경에서 라즈베리파이를 Nas로 활용하고 싶어 OpenMediaValut 5를 설치하는 포스팅을 진행해보려고 합니다. OpenMediaValut는 줄여서 OMV 라고 하며 Nas 운영에 특화된 리눅스이며 데비안의 커널을 사용하고 있기 떄문에 apt, dpkg와 같은 패키지 관리를 사용할 수 있다고 합니다. 설치환경은 라즈비안OS에서 진행하였습니다. 1. OpenMediaVault 5를 Raspberry Pi에 설치하기 아래 명령어를 실행하여 OpenMediaVault를 다운로드 하여 줍니다. wget -O - https://github.com/OpenMediaVault-Plugin-Developers/ins..
라즈베리파이 - 라즈비안 패스워드 변경 안녕하세요 devport 입니다. 라즈베리를 설치를 하고 처음 CLI로 진입하게 된다면 id와 password를 입력하라고 합니다. 어떻게 해야 로그인을 할 수 있을까요? id: pi password: raspberry 위와 같은 정보로 진입하게 된다면 로그인이 됩니다. 하지만 로컬에서만 사용하는 것이 아니라면 보안에 취약할 수 밖에 없는 계정과 패스워드입니다. 최소한 계정의 패스워드라도 변경해보겠습니다. 패스워드 변경하기 패스워드를 변경하기 위해서 아래와 같은 명령어를 입력합니다. $ sudo raspi-config "1. System options"를 선택합니다. "S3 Password"로 진입하여 패스워드를 변경할 수 있습니다.
라즈베리파이 - OS 설치하기 (라즈비안) 안녕하세요 devport 입니다. 기존에 가지고 있던 rasberry3 B+에 다시 라즈베이 파일를 설치해 보기 위해서 설치하는 과정을 담아보고자 포스팅을 작성하였습니다. 0. 준비물 라즈베리파이 micro SD 카드 micro SD 카드 리더기 1. 라즈비안 설치하기 라즈비안은 라즈베리전용 운영체제입니다. 물론 라즈베리 전용 운영체제 뿐 아니라 다양한 리눅스 운영체제를 설치할 수 있습니다. 일단 라즈베리 파이 홈페이지 에서 원하시는 OS 유형을 선택합니다. 라즈비안 OS 설치시에 3가지 설치 유형중 원하는 유형을 설치 하면 됩니다. Raspberry Pi OS with desktop and recommended software GUI 기반 운영체제이며 오피스 및 추가 소프트웨어를 포함하고 있다. (고용..
[개발] Chrome 비밀번호 변경 팝업이 뜨는 이유 안녕하세요 devport 입니다. 이번 포스팅에서는 아래와 같은 팝업이 뜬다면? 왜 뜨는지에 대해서 알아보도록 하겠습니다. 저는 웹을 개발 하던 중에 패스워드를 입력하여 권한을 습득하고 수정할 수 있는 컴포넌트에 대한 개발을 진행하고 있었습니다. 무심코 패스워드를 입력하고 확인을 하였을 때 위와 같은 "사이트 또는 앱의 정보 유출로 인해 비밀번호가 노출되었습니다." 라는 팝업이 노출 되는 것을 확인하였습니다. 로컬에서 개발이 진행이 되는데 어떻게 유출이 되었다고 하는 것일까요? 어떻게 하면 저 팝업이 사라질 수 있는지 그리고 팝업이 출력되는지 이유를 확인해보도록 하겠습니다. 일단 Google Chrome에서 2019-12에 비밀번호 확인 기능이 추가되었다고 합니다. 웹사이트에서 로그인시에 "사용자 계정과..
[개발] Chrome 자동완성을 막아보자 안녕하세요 devport 입니다. 이번에 개발을 진행하면서 Chrome에서 Input타입 컴포넌트에 Name과 Password가 자동으로 입력되어 불편함을 느끼게 되었고 Chrome 버전마다 해결 하는 방법들이 상이하여 이를 막을 수 있는 방법을 히스토리 형식으로 남겨두려고 합니다. Chrome version Solution 87.0.4280.88 autocomplete="new-password"
[개발] CSS - Flex Box 요점 정리 안녕하세요 Devport 입니다. 이번 포스팅에서는 CSS 스타일 중 하나인 Flexible Box에 대한 사용방법에 대해서 간단하게 정리해보려고 합니다. Flex Container display: flex; flex-direction (default: row) Flex Items의 주가 되는 축을 설정합니다. 수평축 or 수직축 등.. row: 방향으로 표시 row-reverse: 방향으로 표시 column: 방향으로 표시 column-reverse: 방향으로 표시 flex-wrap (default: nowrap) Items의 여러 묶음을 설정합니다. nowrap: 줄바뀜이 되지 않고 영영을 벗어날수 있음 wrap: Items를 여러 줄로 묶음 (Item들이 컨테이너의 범위를 넘어서게 되려 할때 다음줄..
[개발] Frontend에서 Cors 해결방법 안녕하세요 devport 입니다. 웹 개발을 하다보면 같은 출처가 아닌 외부의 API를 사용하고자 할때 웹 브라우저에서 에러가 발생하게 됩니다. 에러가 발생하는 이유는 브라우저의 CORS 정책에 위반되기 때문입니다. FrontEnd개발 시에 극복할 수 있는 방법들에 대해서 알아보도록 하겠습니다. 우선 간단히 SOP, CORS 정책에 대해서 알아보도록 하겠습니다. SOP (Same-Origin Policy) 위키에서는 SOP를 "동일 출처 정책"이라고 합니다. 정책명 그대로 동일 출처의 리소스 (HTTP, IMG, CSS... 등)만을 요청할 수 있습니다. 그렇기 때문에 다른 출처의 데이터를 요청을 한다는 것은 정책에 위배되는 행위라고 볼 수 있습니다. 하지만 다른 출처의 요소들에 대해서 허용도 가능해야하..