Azubik

오랜만에 Flutter doctor 명령어를 쳤는데 zsh: command not found: flutter 오류가 나타난다. zshrc파일에 Path 설정이 잘 안됬기 때문에 발생한 문제라고 한다. 우선 터미널에서 zshrc에 환경변수를 재설정 해주기 위해 zshrc를 열고 아래 코드를 입력해준다. // 터미널을 열고 아래 명령을 입력한다. open ~/.zshrc // zshrc 파일이 나타나면 아래 코드를 추가해준 뒤 저장하고 닫는다. export PATH=$PATH:~/development/flutter/bin // 터미널에 아래 명령을 입력하고 다시 flutter doctor를 실행해보자 source ~/.zshrc 플루터를 업그레이드 하라고 하긴 하지만 정상적으로 작동하는것 같다.

출처 : https://meaningless-life.tistory.com/15 [React.js] Default 코드를 자동으로 생성해주는 모듈 React로 js를 계속 만들다 보면 Default Componet를 생성할 때 기본적으로 적어줘야 하는 코드들이 있다. import React from 'react' function TestPage() { return ( TestPage ) } export default TestPage 대충.. meaningless-life.tistory.com import React from 'react' const Main = () => { return ( Main ) } export default Main React 작업을 하다보면 컴포넌트를 생성할 때마다 위와 같은 ..

리액트를 통해 새로운 프로젝트를 만드는 중인데 로그인 기능을 구현하고 싶다. 우선 로그인 버튼을 누르면 로그인 페이지로 이동하지 말고 모달창을 열어서 로그인을 하고 싶은데 모달을 사용하려면 어떡해야 하나? React는 최상위 컨테이너인

CSS는 스타일링을 할 때 자동완성이 되서 편한데 React에서 Styled-components을 사용하면 자동완성이 안되서 아쉽다 이럴 땐 vscode extension중 vscode-styled-components를 설치하면 된다

최상위 부모 '컴포넌트명'Layout으로 생성 최상위 부모 자식(바로 하위 요소) '컴포넌트명'Row or '컴포넌트명'Col Row나 Col이라는 실질적인 태그는 div,section태그등이 될 수 있다. Row는 가로, Col은 세로 둘 다 실제 태그는 div여도 flex-direction으로 설정 최상위 부모가 대분류 느낌이라면 이건 소분류 느낌 나머지 요소 네이밍 예시 div태그: '컴포넌트명'Box section태그: 컴포넌트명'Section ul태그: 컴포넌트명'List li태그: 컴포넌트명'Item p태그: 컴포넌트명'Paragraph span태그: 컴포넌트명'Span or '컴포넌트명&#39..

Homebrew 설치하기 Mac 개발 환경 세팅을 위해 가장 먼저 설치해야 할 macOS 용 패키지 관리자이다. /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" 위 내용을 터미널에 복사해준다. node, npm 설치 Homebrew 설치 후 아래 명령어를 통해 설치한다. brew update brew install node 설치가 잘 되었는지 아래 명령어를 통해 확인해준다. node -v npm -v yarn 설치 아래 명령어를 통해 설치해준다 brew install yarn --ignore-dependencies node는 이미 위에서 설치했으므로 --ignore-dependeci..

프로젝트를 로컬에서 완성하고 업로드 하는김에 호스팅까지 하고 싶다 github에 호스팅을 하려면 gh-pages 모듈이 필요하다. cd TodoApp npm install gh-pages --save-dev 모듈 설치 후 devDependencies가 package.json에 잘 추가되었는지 확인한다. { ... "devDependencies": { "gh-pages": "^3.2.3" }, ... } 추가로 packages.json을 수정한다 { "homepage": "https://usgnusmig.github.io/todoApp", ... "scripts": { ... "predeploy": "react-scripts build", "deploy": "gh-pages -d build", ... },..

gatsby 블로그 작업 종료 후 에러가 나타나서 보니 gatsby 업데이트를 하라는것 같아서 업데이트를 진행했더니 오류가 발생된다. 파일에 액세스 할 권한이 없다고 한다. 해결 방법으로 관리자 권한을 부여해 다시 명령을 실행해준다. 이제 정상적으로 설치가 된다.

gatsby 블로그 외부 링크 클릭시 새창으로 열기 위해 _blank 태그를 추가하니 경고가 나타났다. 이게 무슨 문제인가 찾아보니 Tabnabbing 피싱 공격에 노출될 수 있기 때문이라 한다. Tabnabbing 피싱 공격이란 target_blank인 태그를 클릭하였을 때 새롭게 열린 탭에서 기존 페이지를 피싱페이지로 바꿔 정보를 탈취하는 피싱 공격인데 A 페이지에서 B 링크를 새 창으로 접속하면 탭에 있는 A 페이지가 나도 모르는 새에 C 페이지로 바뀌어 있는 것이다. 해결 방법으로는 target=”_blank” 와 rel=”noopener noreferrer”을 같이 적용한다. rel=”noopener noreferrer”는 rel=noopener 속성이 부여된 링크를 통해 열린 페이지에서 자바스..

HTML 파일에 링크를 삽입하고 페이지에서 클릭할 때 새 창을 띄우고 싶을 때는 어떻게 해야 하나? My site 원하는 링크에target="__blank" 속성을 추가해주면 된다. My site 속성 값 설명 _blank 링크된 문서를 새로운 윈도우나 탭(tab)에서 오픈. _self 링크된 문서를 링크가 위치한 현재 프레임에서 오픈. _parent 링크된 문서를 현재 프레임의 부모 프레임에서 오픈. _top 링크된 문서를 현재 윈도우 전체에서 오픈. 프레임 이름 링크된 문서를 명시된 프레임에서 오픈. 속성을 추가하지 않으면 _self 속성이 기본값으로 추가된다.