30부부 클럽

안녕하세요

오늘은 소니 a7 r2를 가지고 앞산 벚꽃을 잠시 보러다녀왔습니다..

전에 말씀드렸듯이 풀프레임 카메라를 처음 만지다보니(사실 dslr도 거의 만저본적이 없는..)

촬영이 결과물이 그렇게 좋지 못합니다 ㅠ

특히 밤에 출사를 가니 어렵네요.

대구 남구 대명동에 위치한 앞산 먹거리 골목쪽에 꽃향기를 맡으러 잠시 다녀왔습니다.

사실 M모드로 촬영을 할줄 모르기에.. 항상 P와 i(인텔리전스)모드를 사용한답니다.

사진에 대하여 이런저런 블로그를 찾아보았을때,

IOS가 200?400? 이상 넘어가면 좋지 않다고 한 블로그를 본적이 있었습니다..

그런데 저녁이다보니.. IOS가 높지 않으면 어둡게 나오더라구요..

아래 사진은 IOS AUTO 로 촬영하였는데

IOS-6400이네요.!😂

벽에 붙어서 한컷!

아래부터 ISO AUTO로 맞춰서 거의 ISO 6400입니다 ㅠㅠ

확실히 밝은 부분의 경우 빛으로 인해 잘 안보이네요..

아하하.. 그냥 막찍었습니다.

찍다보면 실력이늘겠죠!?!😃😃😃

열심히 찍은 사진들을 공유 해봅니다.

여긴 그 유명한 대덕식당!

나중에 한번 가시길 추천드립니다!😊😊

사진은 엉망이지만,

꾸준히 촬영하여 멋진 사진으로 돌아오겠습니다 😂😂

그럼 이만

안녕하세요.

전 D알못(DSLR을 잘 알지 못합니다)으로 폰카만 열심히 찍었는데,

우연치않게 Sony A6 R2를 가지게 되었습니다.

x손에 초보가 이렇게 고급스러운 카메라를 만져도되나 싶습니다.

열심히 공부해서 저도 사진작가가 되어보렵니다. ㅎㅎ

저의 a7을 소개합니다.

바로 요놈입니다.

렌즈도.. 그냥 번들? 렌즈인것 같구요!

오늘 하루 만져보니.. 여러가지 기능들이 있던데 하나도 모르겠습니다.ㅠㅠ

그래서 가장 기본적인 부분을 좀 찾아보기로 하였습니다.

우선 사진 화질!

위쪽에 menu를 꾹 누르니

여러가지 옵션이 보이더라구요..

그 중에서 사진 포맷?을 보게되었습니다.

표준..파인..raw등등

raw 무슨 편집전의 원본이라는 것으로 대충알고 있는데 도대체 뭔지.. 참😢😢

이미지 크기, 종횡비, 화질 등등 이 있던데요.

대충 메뉴를 보니 내용은 알겠는데.. 구체적으로 얼마나 용량이 되는지 모르겠습니다.

그래서 직접 찍어보았습니다.

귀찮아서 다 찍어보지는 않았습니다. ㅎㅎ

용량, 타입에 따라 용량차이가 꽤나 나는 것을 알 수 있습니다.

RAW의 경우 40M가 넘어가구요.

우선 비교하기 쉽게 이미지 크기를 L만 선별하여 보겠습니다.

이미지 크기 L의 경우 

RAW가 들어가면 40메가가 넘고. 다음은 엑스트라 파인이 29, 13, 11메가가 넘네요.

사실 블로그나 등에 올릴거라서 10M가 이하로 찍는것이 좋을듯 생각하고 있습니다.

그래서 이미지 크기는 L을 피해야겠네요 😢

그래서 다시 선별해보니.

표준이나 파인 이미지크기 M 밑으로 찍어야 10M밑으로 될것 같네요.

참고로 종횡비의 경우는 환경에 따라 다르겠지만.. 저는 16:9로 찍는게 가로 폭이 넓어 이쁜것 같아요..개취입니다 😃

사알못에 간단한 테스트였습니다.

앞으로 더 열심히 공부해야겠습니다.

방에서 한컷!

그럼 이만!

안녕하세요

초보 코더입니다.

이번에는 useRef를 알아볼건데요.

코드는 아래와 같습니다.

import React, { useRef } from "react";

export default () => {
  const potato = useRef();
  setTimeout(() => potato.current.focus(), 5000);
  return (
    <>
      <div>hello</div>
      <input ref={potato} placeholder="what your name"></input>
    </>
  );
};

potato 변수에 useRef를 사용하고.

input 태그에 ref를 연결해줍니다.

(useRef는 document.querySelector()와 같습니다.

potato 변수 밑에 setTimeout 함수를 넣어서 potato(input태그)가 5초뒤에 포커스 되는 것을 넣었습니다.

렌더링 시작 후 input 태그에 focus가 없지만 5초뒤에는?!

자동으로 포커스가 됩니다!!

쉽죠!?

안녕하세요.

초보 코더입니다.

이번에는 useReducer에 대하여 알아볼건데요..

저도 어렵네요.

우선 배운 코드는 아래와 같습니다.

import React, { useReducer } from "react";

const INCREMENT = "increment";
const DECREMENT = "decrement";

const reduceFunction = (state, action) => {
  if (action === INCREMENT) {
    return { count: state.count + 1 };
  } else {
    return { count: state.count - 1 };
  }
  
  // switch (action.type) {
  //   case INCREMENT:
  //     return { count: state.count + 1 };
  //   case DECREMENT:
  //     return { count: state.count - 1 };
  //   default:
  //     throw new Error();
  // }
};

function App() {
  const [state, dispatch] = useReducer(reduceFunction, { count: 0 });
  return (
    <div>
      <div>{state.count}</div>
      <button onClick={() => dispatch(INCREMENT)}>increment</button>
      <button onClick={() => dispatch(DECREMENT)}>decrement</button>
      
    <!--<button onClick={() => dispatch({ type: INCREMENT })}>increment</button>
    <button onClick={() => dispatch({ type: DECREMENT })}>decrement</button> -->
    </div>
  );
}

export default App;

reduceFunction에서 if문과 switch문과는 동일한 내용입니다.

function App에서 useReducer을 사용하는데요. 

여기서 받는 인자 2개에서 앞에는 fn을 뒤에는 state 초기값으로 보시면됩니다.

그리고 useReducer가 실행될때 첫번째 받은 함수(reduceFunction)이 실행되면서 버튼onClick에 있는 dispatch함수가 같이 실행이됩니다. dispatch함수 내 인자를 받게되는데요.

해당 인자가 if문(또는 swich문)에서 조건으로 작용하여 state를 바꾸게 됩니다.

그럼 +1 또는 -1이 됩니다!!

끝!

안녕하세요

초보코더입니다.

현재 react-hook을 공부하고 있는데요!

useEffect에서 간단하게 공부를해봅시다.

import React, { useState, useEffect } from "react";

const App = () => {
  const sayHello = () => console.log("hello!");
  const [number, setNumber] = useState(0);
  const [aNumber, setANumber] = useState(0);
  useEffect(() => {
    sayHello();
  }, [number]);

  return (
    <>
      <h1>hello</h1>
      <button onClick={() => setNumber(number + 1)}>{number}</button>
      <button onClick={() => setANumber(aNumber + 1)}>{aNumber}</button>
    </>
  );
};

export default App;

number, aNumber의 state를 만들었습니다.

useEffect 함수에서 sayHello 함수를 호출하게 만들었습니다.

그리고 {},[number] 이라는 조건을 넣어놨는데. number이라는 state만 바뀔때 sayHello() // console.log("hello!")를 호출합니다.

useEffect는 componentDidMount와 componentDidUpdate 를 합친 형태와 비슷합니다.

시작했을 때 콘솔창에 hello를 한번 출력합니다.

화면의 모습은 아래와 같습니다.

앞쪽 버튼을 누르면 누른만큼 state가 변하며 sayHello를 호출합니다 (콘솔창참고)

두번째 버튼을 누르면 조건을 넣었기 때문에 

콘솔창을 출력하지 않습니다.

아직 공부하는 중이라 부족한 부분이 많네요.

혹시나 틀린 부분이 있으시면 답남겨주시면 수정토록할게요!

감사합니다.

안녕하세요.

초보 코더 입니다.

해당 내용으로 블로그를 쓰기엔 너무 초보적인 부분인데.. (제가초보라서)

react hook을 공부하다보니.. 인강에서 나온부분이 실행이 안되길래 찾아보았습니다.

여러가지 이유가 있지만 첫번째 이유가! 바로! react 최신 버전이 hook을 지원하지 않는다는...

(20.02월 기준 16.8까지 hook을 지원한다고 되어 있네요.)

저는 항상

$ npx create-react-app Project

으로 react를 설치하는데요.

package.json 파일에 가보니

    "react": "^16.12.0",

    "react-dom": "^16.12.0",

로 설치가 되어있었습니다.

저는 react 버전을 낮추는 방법을 몰랐는데..

기존에 항상 패키지를 잘 설치해왔음에도.. 몰랐다는..

그래서 정답은.!

$ yarn add react@16.8.0

$ yarn add react-dom@16.8.0

으로 설치해주시면됩니다..

이렇게 쉬운걸 적기가 좀 그렇지만.. 저와 같은 초보 코더분들을 위해..간단하게 적어봅니다..(사실 이러때문에 20~30분동안 찾음-0-)

그럼 즐코딩되세요!

안녕하세요.

react를 열심히 독학으로 공부하고 있는 초보 코더입니다.

매번 npx create-react-app만 설치하다보니. npm react설치 법을 까먹었더라구요..

너두 초보적인 부분이라 간단하게 적어봅니다.

저는 보통 VS-CODE를 사용하는데요.

1. 우선 react를 글로벌로 설치합니다.

$ npm install -g create-react-app

2. 이후에 저는 2020react 라는 폴더를 만들었는데요.. ( 숫자가 앞에 붙은건 그렇게 좋지 않아보입니다..)

새로 생성한 폴더에 들어가서 react 를 설치합니다.

$ mkdir 폴더명

$ cd 폴더명

$ npm create-react-app .   

(. 점을꼭넣으세요)

끝!

안녕하세요. 초보 코더입니다.

제대로 공부를 안해서 그런지 git을 사용할때마다 너무 헷갈리네요..

저는 단순히 연습한 코드를 git 에 업로드하고 다운받고 재업로드 정도만 사용하고 있는데..

심지어 이것도 어렵더라구요.

(혹시나 틀렸으면 알려주세요!)

그래서 제가 자주 쓰는 명령어만 정리해보았습니다.

1) git 로그인

$ git config --global user.name "유저네임"
$ git config --global user.email 유저이메일

2) git 연결

$ git remote add origin URL 주소

3) git url 확인

$ git remote -v

4) git 업로드

$ git add .
$ git commit -m "#설명"
$ git push -u origin master

추가적으로

* 기존에 사용하던 파일이 있을 경우에 강제로 업로드 하는방법

$ git push -u origin +master

* 현재 컴퓨터에 파일을 무시하고 git 파일 다운받기

$ git pull origin master --allow-unrelated-histories

* git error

warning: LF will be replaced by CRLF in src/index.js.
The file will have its original line endings in your working directory

$ git config --global core.autocrlf true