분류 전체보기
-
[A와의 대화 두번째] 이날치, 리쌍, 위로가 되는 노래를 듣는 A와의 대화A와의 대화 2020. 11. 28. 01:14
www.youtube.com/playlist?list=PLQI9GCKpH1Q2zUO6zbyqcSLcFIdyro6K6 이날치, 리쌍, 위로가 되는 노래를 듣는 A와의 대화 www.youtube.com - 요즘 뭐하고 지내? - 일적인 얘기를 하면, 9월에 논문 제출을 했어. 우리는 논문을 제출하면 점수랑 리뷰가 같이와. 점수로 심사에서 떨어지는 건 아니고, 반박할 수 있는 기회를 줘. 반박문을 쓰는 거지. - 반박문? - 말 그대로. "네가 잘 못 이해한걸껄? 내 논문은 그런 게 아닌걸? 제발 붙여주세요..." 굉장히 어려워... 너무 빌빌 기어도 안되고, 너무 막 나가도 안되고. 엘레강스하고도 거칠게 얘기해야 하거든. 그거를 쓰고 있었어. - 어렵겠다... - 사실 이거를 연구한 지가 좀 됐어. 암튼 그..
-
[React 튜터링 일지] React 기본 1주차React.js 2020. 11. 27. 02:05
소소하게 React를 이용한 웹 개발 튜터링을 진행하게 되어 일지를 남긴다. 1. React를 이용한 웹 개발 stack에 대한 설명 보통 react와 함께 react-router, redux를 사용한다. react-router는 SPA에서 url path에 따라 다른 react component를 렌더링하게 도와준다. redux는 중앙 데이터 저장소(store)로 react의 한방향 데이터 전달로 인한 개발 번거로움을 덜어준다. 위 항목 얘기하면서 component가 뭔지, redux 얘기하면서 redux 없이 실제 헤비한 웹 개발하면 어떤 불편함이 있을지 설명하기위해 Component Tree 구조에 대해 설명함 2. Component란? React는 Component로 이뤄진 Tree이다. Comp..
-
[초심자 튜터링] React의 render() 리턴에 대하여React.js 2020. 11. 26. 02:04
개인적으로 React를 소소히 튜터링하는 중인데, 튜터링하며 받는 질문에 대한 답변을 공유한다. 초심자 기준이라 완전 초심자용 내용일수도. 질문: React render에서 왜 에러가 나나요? 질문 코드 예시 class App from React.Component { // 생략 someFunction() { return someFunction; } render() { return ( ...생략... someFunction() ); } } 답변 1: JSX 구문 안에서 javascript 구문은 { }으로 감싸져야 합니다. 여기서는 render함수의 return으로 "JSX 문법을 사용한 것" 반환하고 있습니다. 그리고 Javascript 변환시 JSX 부분이라고 생각할 겁니다. 지금 이대로라면 (답변 2..
-
Javascript class의 내부 함수, methodjavascript 2020. 11. 26. 01:36
개인적으로 React를 소소히 튜터링하는 중인데, 튜터링하며 받는 질문에 대한 답변을 공유한다. 초심자 기준이라 완전 초심자용 내용일수도. 질문: React Component 안에 함수를 정의했는데 왜 빨간줄이 생길까? class App extends React.Component { constructor(props) { // 생략 } // 아래 오류 function appFunction() { } render() { return( ); } }Class 내부 method 선언하기 우리가 만드는 React Component는 보통 Class 000 extends React.Component 형식을 하고 있습니다. 그리고 Class로 선언하였으므로 React Component이기 이전에 이는 Javascrip..
-
Javascript Import에 대하여 - import React from 'react'javascript 2020. 11. 23. 22:14
Import 용법 Created: Nov 23, 2020 9:50 PM https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import mdn은 javascript의 교과서당 module을 통째로 가져오는 경우 // something.jsx import React from 'react'; React 소스코드를 보면 'react' package는 main으로 index.js를 내보낸다(export). 코드에서 가져다 쓸 땐, 기본적으로 export 결과물인 아래와 같은 Object(map, 혹은 key, value로 이루어진 자료구조)를 받게 된다. // react source index.js ex..
-
[A와의 대화 첫번째] 백예린, HONNE, 재즈를 듣는 A와의 대화A와의 대화 2020. 11. 23. 00:32
www.youtube.com/playlist?list=PLQI9GCKpH1Q3VjEpAlCtgk77GpUB8qcek 백예린, HONNE, 재즈를 듣는 A www.youtube.com - 요즘 어떻게 지내? - 요즘 일하면서 지내. 회사에 들어간 지 얼마 안 돼서 일을 하는데 똑같은 일이어도 내가 하면 시간이 오래 걸려서. 일 하는데에 많은 시간을 투자해. - 응응 - 지금 재택 하는 중인데 일어나자마자 바로 일 하고, 퇴근하고 바로 잠들어서 자괴감이 들더라구. - 퇴근하고 바로 잤다구? - 11시에 침대에 누웠지. 그러고 뭐 잠깐 핸드폰 보다가 잤지만, 평소대로라면 퇴근 후 나의 시간이 있잖아. 친구를 만날 수도 있고 맛있는 걸 먹을 수도 있고 그런 거. 그런 게 없어서 자괴감이 든 거지. - 헉... ..
-
React project structure articlesReact.js 2020. 11. 17. 11:05
React 튜터링을 위해 조사하며 찾은 좋은 article들을 모아봤다 1. medium.com/@Charles_Stover/optimal-file-structure-for-react-applications-f3e35ad0a145 Optimal file structure for React applications Dan Abramov famously officialized the file structure for React applications as “move files around until they feel right.” I do not want to… medium.com "One of the most important and agreed upon structures for a React projec..
-
React Router에 대해서 내가 모르던 것들React.js 2020. 11. 4. 13:27
1. react-router-dom vs react-router react-router는 SPA(Single Page Application)에서 페이지 이동(새롭게 페이지 GET을 해오고, 다시 그리고, 그 사이에 사용자는 깜빡인다고 느껴지는 과정들) 없이 화면간 이동을 할 수 있게 만들어주는 library입니다. react-router는 이러한 기술의 core입니다. react-router를 import해서 쓰고 있는것이 react-router-dom인데, react-router-dom은 이제 웹(프론트엔드)을 개발하면서 필요한 dom 요소들을 렌더링하는 component를 추가로 가지고 있습니다. 는 브라우저 렌더링할때 tag를 그리고, 는 뒤로가기 앞으로가기 등의 이동 이력을 관리하는 window...