본문 바로가기

전체 글109

[Figma] 좌충우돌 Figma i18n 플러그인 제작기 회사 블로그 blog.promedius.ai/figma-i18-plugin/ 에 올린 글입니다. 아카이브용으로 가져왔어요. 개발팀 인턴의 좌충우돌 Figma i18n 플러그인 제작기 Figma를 아시나요? Figma Figma는 UI 프로토타이핑 툴인데요. 위처럼 단순히 와이어프레임을 만들 수 있을 뿐 아니라, 이렇게 요소들의 상호작용도 표현할 수 있습니다. 무엇보다 이렇게 여러 사람이 blog.promedius.ai ▲ 글 열심히 꾸며 놓았으니 요 링크에서 봐주세요. 🤗 Figma를 아시나요? Figma는 UI 프로토타이핑 툴인데요. 위처럼 단순히 와이어프레임을 만들 수 있을 뿐 아니라, 이렇게 요소들의 상호작용도 표현할 수 있습니다. 무엇보다 이렇게 여러 사람이 함께 수정도 가능합니다. 게다가 웹 기.. 2021. 5. 4.
[TIL] 환경 변수의 PATH는 뭔데 자꾸 추가하라고 할까? PATH가 뭔데 환경 변수(環境 變數, 영어: environment variable)는 프로세스가 컴퓨터에서 동작하는 방식에 영향을 미치는, 동적인 값들의 모임이다. 라고 위키백과에 적혀 있는데요. 말 그대로 시스템에 반영되는 변수겠죠. 그런데 이렇게만 보면 PATH에 대해서는 사실 잘 모르겠습니다. 대체 뭔데 프로그램을 깔고 나면 설치 경로를 환경 변수 PATH에 추가하라고 할까요? 일단 윈도우에서 시스템 환경 변수 편집에서 환경 변수에 들어가면 환경 변수의 목록을 볼 수 있는데 여기서 Path를 찾아서 편집을 누르면 이렇게 목록이 뜹니다. 귀찮으면 윈도우의 경우 $ echo %path% cmd 열어서 이렇게 쳐도 나오고요. (윈도우가 아니면 아마 $PATH) 이 path가 대체 뭐냐면 프로그램을 찾는.. 2021. 5. 2.
[Cordova] 아파치 코도바 찍어먹기 - 설치와 세팅 아파치 코도바(Apache Cordova)로 리액트 프로젝트를 돌돌 말아서 모바일 앱으로 구동하는 것이 목표인 '아파치 코도바 리액트에 찍어먹기' 포스팅입니다. Create your first Cordova app 을 따라해보겠습니다. 명령줄 인터페이스 - Apache Cordova 명령줄 인터페이스 이 가이드에서는 응용 프로그램을 만들고 사용 하 여 다양 한 네이티브 모바일 플랫폼에 배포 하는 방법에 cordova 명령줄 인터페이스 (CLI). 이 도구를 사용 하면 새 프로젝트를 cordova.apache.org Cordova CLI 설치하기 npm에서 cordova를 설치합니다. $ npm install -g cordova 프로젝트를 시작할 경로에서 다음 명령어를 입력하세요. $ cordova cre.. 2021. 5. 1.
[ESLint] Parsing error: Unexpected token ESLint를 돌리는데 Parsing error: Unexpected token 라는 에러가 계속 떴습니다. 알아보니 ESLint의 기본 parser는 Espree로, 기본적으로 ECMA 버전이 5로 설정되어있기 때문에 그 이후 문법이나 Typescript 문법은 parse하면서 에러를 뿜을 수 있다고 합니다. .eslintrc 파일을 만들어서, { "parser": "babel-parser" } 위 코드를 작성해 parser를 babel parser로 설정해주면 최신 ECMA 버전을 사용할 수 있습니다. 일반적으로는 이것만 추가하면 해결이 됩니다. 그런데 babel-parser는 Typescript 문법은 해석을 못 하는 것 같습니다. 저같은 경우에는 babel-parser로 parser를 바꾸어도 T.. 2021. 4. 15.
[딥러닝] 파이토치 개발환경 구축 2. CUDA로 GPU 사용하기 r4bb1t.tistory.com/59 [딥러닝] 파이토치 개발환경 구축 www.anaconda.com/products/individual 접속한다. 다운로드 클릭 후 설치파일을 관리자 권한으로 열어서 설치한다. 설치가 끝나면 프롬프트를 실행한다. $ conda create -n pytorch python=3.7 입력하면 파이썬.. r4bb1t.tistory.com 개발환경을 구축했으면 이제 프로그램을 GPU에서 돌려볼 수 있습니다. 설치가 모두 제대로 되었는지 확인해봅시다. import torch print(torch.cuda.is_available()) 제대로 설치가 됐다면 True가 뜹니다. import torch CUDA_AVAILABLE = torch.cuda.is_available() DEVI.. 2021. 3. 1.
[HTML] 티스토리 사이드바에 프로필 넣기 제 블로그에는 프로필 란이 있는데요, 이미지를 넣고 싶어서 직접 만들었습니다. 이 부분의 코드를 공유합니다. 티스토리 블로그 관리 > 스킨 편집 > html 편집에서 ctrl+F로 를 찾아줍니다. ID 자기소개를 넣어주세요. 제목1 내용1 제목1 내용1 제목1 내용1 해당 부분에 위 코드를 붙여넣기 해주세요. 부분에는 블로그 프로필 사진이 들어가는데, 다른 사진을 넣고 싶다면 '해당 이미지 주소' 로 대체해주시면 됩니다. 도 기본적으로 아이디가 들어가는데 이름이나 등등으로 대체할 수 있습니다. 자유롭게 수정해서 사용해주세요! 2021. 2. 27.
[딥러닝] 인공신경망(ANN), MNIST 데이터 셋 분류 본 포스팅은 고려대학교 전기전자공학부 김중헌 교수님의 데이터과학원 강의 '딥러닝 프로그래밍 기초 다지기- 인공신경망 프로그래밍 기초 / 인공신경망 프로그래밍 구현'을 토대로 정리했습니다. 강의는 Tenserflow로 진행되었지만 파이토치로 구현하기 위해 를 참고했습니다. 기본 개념은 를 참고했습니다. 인공신경망(ANN) 인공신경망(ANN)은 생물학의 신경망(동물의 중추신경계중 특히 뇌)에서 영감을 얻은 통계학적 학습 알고리즘입니다. (한국어 위키백과) 하나의 레이어에서 다른 레이어로 정보를 보낼 때의 기본적인 구조입니다. 위에 있는 레이어로부터 받아들인 입력(X)를 가중치(W)를 통해 증폭(W>1) 혹은 감쇠(W 2021. 2. 26.
[BOJ] 10167. 금광 10167번: 금광 첫 줄에는 금광들의 개수 N (1 ≤ N ≤ 3,000)이 주어진다. 이어지는 N개의 줄 각각에는 금광의 좌표 (x,y)를 나타내는 음이 아닌 두 정수 x와 y(0 ≤ x,y ≤ 109), 그리고 금광을 개발하면 얻게 되는 이익 www.acmicpc.net 어떤 2차원 그래프에서, 가능한 직사각형 모양의 범위 내부에 있는 정점의 값의 합 중 최댓값을 구하는 문제입니다. 좌표 x, y의 범위는 (0 ≤ x,y ≤ 10^9)인데, 정점의 개수는 최대 3000개이므로 좌표 압축을 사용해 (0 ≤ x,y < 3000) 으로 만들어줍니다. 시간 제한은 3초이므로 O(N^2logN) 으로 해결하면 됩니다. 일반적으로 사각형을 선택하는 기준은 세로 선 두 개, 가로 선 두 개로 O(N^4)라고 생.. 2021. 2. 20.
[Next JS] Next JS 시작하기 React는 CSR(클라이언트 사이드 렌더링) 방식으로 SPA(싱글 페이지 어플리케이션)를 만들 수 있는 프레임워크입니다. (오늘부터는 존댓말을 쓰기로 했습니다.) CSR 방식인 그냥 리액트의 경우 브라우저가 서버에서 html과 정적 파일을 받아온 후 데이터를 요청해서 받아와 렌더링합니다. 초기에 정적 파일을 다 받아오기 때문에 데이터 요청이 있을 때만 서버에 요청하면 됩니다. 또, JS로 화면에 렌더링되기 때문에 JS를 크롤링 할 수 없는 검색엔진에서는 검색엔진 최적화가 어렵습니다. Next JS는 React 기반으로 만들어진 프레임워크입니다. Next JS를 이용하면 리액트에서 SSR(서버 사이드 렌더링) 방식으로 렌더링을 할 수 있습니다. SSR은 초기에 필요한 데이터를 미리 가져와 데이터가 채워진.. 2021. 2. 6.
[BOJ] 16287. Parcel 16287번: Parcel 입력은 표준입력을 사용한다. 입력의 첫 줄에는 무게 w(10 ≤ w ≤ 799,994)와 A의 원소 개수 n(4 ≤ n ≤ 5,000)이 공백으로 분리되어 주어진다. 다음 줄에는 A의 원소인 n개의 정수 ai ∈ A(1 ≤ i ≤ n)가 www.acmicpc.net 요약하자면, 주어진 배열 A 안의 임의의 4개의 원소들의 합이 W가 되는 경우가 있는지 여부를 출력하는 문제이다. 처음 생각났던 풀이는 앞의 세 원소는 하나씩 고르고 마지막 원소는 lower_bound로 찾기였다. 당연히 세 원소 고르는 것만 O(N^3)이고 N ≤ 5,000인데 될리가 없다. 시간복잡도 O(N^2) 안에 풀어야 하기 때문에 원소들을 두 개씩 묶는다는 아이디어까지는 쉽게 떠올릴 수 있었다. 원소 두 .. 2021. 1. 27.
[BOJ] 13334. 철로 13334번: 철로 입력은 표준입력을 사용한다. 첫 번째 줄에 사람 수를 나타내는 양의 정수 n (1 ≤ n ≤ 100,000)이 주어진다. 다음 n개의 각 줄에 정수 쌍 (hi, oi)가 주어진다. 여기서 hi와 oi는 −100,000,000이상, 100,000,0 www.acmicpc.net 처음 생각했던 풀이는 각 (집, 사무실) 쌍을 시작점 기준으로 정렬한 후 각 쌍을 순회하며 뒤쪽의 끝점들만 따로 정렬한 후 upper_bound로 계산하기...였다. 잘 안 풀리는데다 좋은 풀이도 아닌 것 같아서 매주 일요일마다 진행하는 알고리즘 스터디에 가져갔는데, 이거 우선순위 큐 문제라는 얘기를 듣고 바로 풀이가 생각나서 뚝딱뚝딱 풀었다. struct comp_second { bool operator()(p.. 2021. 1. 27.
[딥러닝] 파이토치 개발환경 구축 www.anaconda.com/products/individual 접속한다. 다운로드 클릭 후 설치파일을 관리자 권한으로 열어서 설치한다. 설치가 끝나면 프롬프트를 실행한다. $ conda create -n pytorch python=3.7 입력하면 파이썬 3.7 기반의 pytorch라는 가상환경이 생긴다. $ conda activate pytorch 가상환경을 켠다. developer.nvidia.com/cuda-toolkit-archive 에서 CUDA를 설치한다. 11.0으로 했다. (왠지 모르겠는데 다운로드 버튼 클릭하면 안 먹하고 새 탭에서 열기 해야 다운로드 창이 열림. 왜지?) 그 와중에 마우스 프로세스 꺼야 한다고 해서 끄고 다른 마우스 끼웠다... 오래 걸린다. pytorch.org/ 에.. 2021. 1. 27.