대내 활동
2020 겨울방학 모각코 초기 계획
겨울방학 모각코(모여서 각자 코딩) 초기 계획 www.udemy.com/course/react-the-complete-guide-incl-redux/ 유데미 react-native 강좌 끝내기 1. 12월 29일 (화) 챕터1, 챕터2 수강 (1시간 20분) - 환경설정 및 자바스크립트 복기 2. 1월 5일 (화) 챕터3 수강 (2시간 21분) 3. 1월 12일 (화) 챕터 4,5 수강 (2시간 5분) 4. 1월 19일 (화) 챕터 6,7강 수강 (3시간 14분) 5. 1월 26일 (화) 챕터8 수강 (4시간) 6. 2월 2일 (화) 챕터 9,10 수강 (2시간)
웹 프로그래밍 멘토멘티 프로그램 5회차
웹 서버 우리가 웹사이트에 접속을 하면 홈페이지들이 보이는데 그게 그냥 보이는 것이 아닌 우리 JS, HTML, CSS등을 이용해서 홈페이지를 만든 것 처럼 우리가 접속하는 해당 홈페이지도 각종 웹 파일들이 필요할 건데 그게 우리 컴퓨터에 저장이 되어있다면 괜찮겠지만 그런 것이 아니기 때문에 해당 홈페이지에 필요한 웹 페이지 파일들을 웹 서버라는 곳에 요청을 해서 웹페이지를 보여주게 됩니다. 1. 클라이언트는 서버에 HTML 문서를 요청 2. 웹 서버는 사용자가 요청한 HTML문서를 웹 브라우저에게 전달 3. 웹 브라우저는 웹 서버로부터 전송받은 HTML문서를 읽어들인 후 해석 HTML문서를 보여주기 위해 필요한 img,CSS,JS 같은 리소스들에 대해 URL을 추출하며 동시에 웹 서버에 여러 개의 리소..
웹 프로그래밍 멘토멘티 프로그램 4회차
Javascript Node HTML 문서의 정보는 노드 트리(node tree)라고 불리는 계층적 구조에 저장됩니다. 이러한 노드 트리는 노드들의 집합이며, 노드 간의 관계를 보여줍니다. 노드 트리는 최상위 레벨인 루트 노드(root node)로부터 시작하여, 가장 낮은 레벨인 텍스트 노드까지 뻗어 내려갑니다. 자바스크립트에서는 HTML DOM을 이용하여 노드 트리에 포함된 모든 노드에 접근할 수 있습니다. 노드 간의 관계 노드 트리의 모든 노드는 서로 계층적 관계를 맺고 있습니다. 노드 트리의 가장 상위에는 단 하나의 루트 노드(root node)가 존재합니다. 루트 노드를 제외한 모든 노드는 단 하나의 부모 노드(parent node)만을 가집니다. 모든 요소 노드는 자식 노드(child node)..
웹 프로그래밍 멘토멘티 프로그램 3회차
Javascript (JS) 자바스크립트(JavaScript)는 객체(object) 기반의 스크립트 언어입니다. HTML로는 웹의 내용을 작성하고, CSS로는 웹을 디자인하며, 자바스크립트로는 웹의 동작을 구현할 수 있습니다. 자바스크립트는 주로 웹 브라우저에서 사용되나, Node.js와 같은 프레임워크를 사용하면 서버 측 프로그래밍에서도 사용할 수 있습니다. 현재 컴퓨터나 스마트폰 등에 포함된 대부분의 웹 브라우저에는 자바스크립트 인터프리터가 내장되어 있습니다. 1. 자바스크립트는 HTML의 '내용'을 변경할수 있습니다 2. 자바스크립트는 HTML의 '속성'을 변경할수 있습니다. 3. 자바스크립트는 HTML의 '스타일'을 변경할수 있습니다. Javascript 문법 var firstVar = 10; /..
웹 프로그래밍 멘토멘티 프로그램 2회차
css HTML 등의 마크업 언어로 작성된 문서가 실제로 웹사이트에 표현되는 방법을 정해주는 언어. CSS의 C가 Cascading의 약자인데, 이는 상위 요소의 스타일 속성을 자손 요소들에게 상속시켜주는 모습이 DOM 트리구조에서 마치 폭포수처럼 내려가는 모습을 닮았기 때문이다. 이해못해도 됨 css 문법 h1 { color: red; font-size: 20px } 주석 p { color: red; /* This is a single-line comment */ text-align: center; } /* This is a multi-line comment */ Visual Studio Code 꿀팁 Ctrl + / 누르면 자동주석 됨 Selector CSS 선택자(Selector)란? 선택자란 말 ..
웹 프로그래밍 상상튜터링 프로그램 1회차
계획 1차 8/25 (7~9시) Web Programming, HTML 웹 프로그래밍 과목에 대해서 기본적인 이해와 전반적인 소개를 한다. 전체적인 흐름 알려주고 날짜별 계획을 말해줌으로써 큰 틀을 숙지한다. HTML의 이해와 기본 문법에 대해서 공부를 한다. HTML의 각종 태그들을 이용해서 간단한 홈페이지 만들기 여러 태그들을 사용해보고 태그들에 대한 이해를 한다. Form과 Table을 사용해보고 전반적인 이해를 한다. 2차 9/1 (7~9시) CSS CSS에 대한 기본적인 이해와 기본 문법에 대해서 공부를 한다. HTML과 CSS를 이용해서 홈페이지를 만드는 실습을 해본다. HTML과 CSS를 이용한 간단한 홈페이지 만들기 스타일링을 적용할 수 있는 CSS를 이용해서 홈페이지를 만들어본다. id와..
8월 8일 모각코 종료
react 프로젝트 4명이서 협업을 하였습니다. 전체 UI에 대한 구상을 하였고 import React, {Component} from 'react'; import './App.css'; import Content from './components/Content'; import Sidebar from './components/Sidebar'; import pythonImg from './images/python.png'; import arduinoImg from './images/arduino.png'; import cPlusPlusImg from './images/C++.png'; import javaImg from './images/java.png'; import juliaImg from './ima..
모각코 8월 1일 종료
오늘은 리액트 관련 사이트들을 찾아보고 공부하기전에 즐겨찾기화 해놓았습니다. 그리고 리액트 프로젝트에 관해서 아이디어를 간단히 생각해보았습니다. 생각해 본 아이디어들 요즘 성격 유형 분석이 많은데 그런 것 처럼 내가 좋아하는 롤에도 유형 분석을 해서 사람들에게 알려주면 좋지 않을까? MBTI 롤 테스트 https://next.op.gg/mbti 이미 나와있는 것이 있었다.. 조금 더 찾아보아야 할 것 같다. 찾아본 사이트들 인프런에서 리액트와 노드에 관한 강의 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의 - 인프런 이 강의를 통해서 리액트와 노드를 어떻게 사용하는지 기본적인 내용들을 배울 수 있습니다. 초급 웹 개발 프레임워크 및 라이브러리 React Node.js 웹 개발 온라인 강의 실무에서 ..
7월 25일 모각코 종료
1. Dockerfile에 대한 공부 2. 깃허브 브랜치에 대한 이해 Dockerfile 설명 설명드리겠습니다. FROM node:10.19.0 맨 처음에는 FROM으로 시작합니다. 우리는 node version 10.19.0 으로 된 이미지를 만들고 싶다는 얘기입니다. 제 node -v이 10.19.0이라서 설정해주었습니다. WORKDIR /app work directory를 /app에 잡겠다는 얘기입니다. 이건 컨테이너 안에서의 폴더를 얘기합니다. COPY . . COPY 를 얘기합니다. 둘 다 현재위치를 의미하는데 local folder는 Dockerfile이 존재하는 파일의 위치를 가리키고 container folder는 WORKDIR로 설정해준 /app 폴더를 가리킵니다. RUN yarn ins..