Tech Blog of Pinomaker
[Linux] 자주 사용하는 터미널 명령어
DevOps/OS 2022. 5. 9. 11:20

cd 'cd' 명령어는 디렉토리(폴더 경로)를 이동하고 싶을 때 사용한다. 상대 경로 혹은 절대 경로로 사용이 가능하다. #현재 경로에 있는 test 폴더로 이동 cd test #현재 경로의 상위 폴더로 이동 cd .. #현재 경로에 있는 test/hello 폴더로 이동 cd test/hello #절대 경로 이동 cd /usr/admin/documents ls 'ls' 명령어는 현재 디렉토리에 존재하는 모든 파일 목록을 확인 할 수 있다. mkdir 'mkdir' 명령어는 폴더를 현재 경로에 생성한다. #test 폴더 생성 mkdir test #test 폴더로 이동 cd test touch 'touch' 명령어는 현재 경로에서 파일을 생성 할 수 있다. #hello 파일 생성 touch hello #in..

[Linux] 터미널 경로 확인하기.
DevOps/OS 2022. 5. 9. 11:13

Visual Studio Code를 이용하거나, Git Bash 등 다양한 터미널을 사용 할 때 터미널에 익숙치 않은 사람들은 경로 설정에서 실수를 많이 하게 된다. 터미널을 사용하면 command line 마다 현재 터미널의 경로가 적혀있다. 글쓴이의 경로 : /documents Visual Studio Code도 마찬가지다. 글쓴이의 경로 : /documents/project create-react-app test 당신이 create-react-app을 통하여 react 프로젝트를 생성한다면, 현재 경로에 test라는 폴더가 생겼을 것이다. 하지만 당신의 터미널 경로는 생성된 test 폴더가 아니라, 여전히 documents/project다. 따라서 터미널 명령어를 사용하여 경로 설정을 해주거나, 폴..

[React] Map을 이용하여 To do List
F.E/React 2022. 5. 8. 11:31

사용 기능 - Map - useState //App.js import { useState } from "react" function App() { //input 입력 값 관리 const [toDo, setToDo] = useState("") //To do List 상태 관리 const [toDos, setToDos] = useState([]) //BtnClick Event const onSubmit = (e) => { e.preventDefault() //input 입력 값이 빈 값이면 다시 돌려보냄 if (toDo === "") { return } //입력 값을 현재 배열과 더해 새로운 배열을 생성 setToDos((current) => [...current, toDo]) //입력 값 초기화 setTo..

[React] useEffect 사용 방법
F.E/React 2022. 5. 8. 10:54

useEffect는 컴포넌트가 빌드 되었을 때, 업데이트 될 때 마다 실행하게 되는 훅 입니다. export default function Count () { const [count, setCount] = useState() console.log("Count On") return setCount((current) => current + 1}>{count} } 위와 같은 코드를 작성하게 되면, count의 상태가 변경될 때 마다 React는 컴포넌트를 refresh하기 때문에, console.log("Count On") 부분이 계속 찍히게 됩니다. 하지만 저희는 해당 컴포넌트가 빌드 되었을 때 한 번만 실행하고 싶기에 useEffect를 사용하게 됩니다. import { useEffect } from 'r..

[Django] Django 개발 환경 구축(Mac, Anaconda, IntelliJ)
Language/Python 2022. 5. 7. 12:51

해당 게시글은 Mac에서 Anaconda와 IntelliJ를 이용하여 구축 합니다. 01. Anaconda 설치 해당 사이트에 접속하여 Andaconda를 설치한다. Anaconda | Anaconda Distribution Anaconda's open-source Distribution is the easiest way to perform Python/R data science and machine learning on a single machine. www.anaconda.com 02. Django 설치 Anaconda를 이용하여 Django를 설치한다. #conda를 이용한 Django 설치 conda install django 03. Django 폴더 생성 django-admin startproj..

[Github] Github 사용하기
CS/Git 2022. 5. 7. 12:09

해당 강좌는 Github 계정을 생성했다는 가정하에 진행 합니다. 01. Git 설치하기. 해당 사이트에 접속한 후 GIT을 설치한다. Git git-scm.com MAC 사용자의 경우 아래의 명령어를 사용하여 설치한다. //homebrew가 있을 경우 brew install git //homebrew가 없을 경우 sudo port install git 윈도우 사용자는 Git을 설치했을 때 Git BASH라는 새로운 터미널 프로그램이 설치가 되는 데 해당 터미널을 이용한다. 02. Github Repository 생성하기. Github에 접속 및 로그인 후 새로운 Repository(저장소)를 생성한다. GitHub: Where the world builds software GitHub is where ..

[React] 컴포넌트의 타입 관리, prop-types
F.E/React 2022. 5. 5. 20:35

React props의 타입 문제 React는 props에 매개 변수를 넘길 때 타입 검사를 하지 않는다. 나는 Number 자료형으로 넘겨 받고 싶지만, 만약 String이 넘겨와도 문제가 되지 않는다 HTML 삽입 미리보기할 수 없는 소스 const Age = (props) => { return {props.age} } const App = () => { return( ) } 위와 같은 경우가 생기기에, 좀 더 타입을 명확히 해주기 위해서 PropsTypes 기능을 사용한다. //prop-types 모듈을 설치한다. npm install prop-types Proptypes 사용 방법 이제 을 사용하게 되면 타입이 맞지 않아 문제가 된다. const Age = (props) => { return {p..

[React] 함수형 컴포넌트에서 props 사용하기.
F.E/React 2022. 5. 5. 20:22

props란? 컴포넌트를 빌드할 때, 컴포넌트를 생성하는 함수의 매개 변수로 전달이 가능한 기능 아래의 코드는 input tag의 상태를 useState로 관리하여 그 값을 Btn 컴포넌트 props에 넘겨주는 코드 입니다. HTML 삽입 미리보기할 수 없는 소스 props에 넘길 수 있는 값 props에는 일반적으로 데이터를 넘기지만, 함수 등 다양한 값을 넘길 수 있다. const Test = ({name, click}) => { return( {name} ) } const App = () => { const onClick = () => { window.alert("Click Success") } return( ) }

[React] 함수로 props 사용하여 소문자 혹은 대문자로 바꾸기
F.E/React 2022. 5. 5. 20:12

HTML 삽입 미리보기할 수 없는 소스

[React] Super Converter
F.E/React 2022. 5. 5. 16:21

1. 기능 구현 1. 시간 분 2. Km Meter