본문 바로가기
반응형

전체 글300

14. TwitterBootstrap 1/2 (생활코딩 작심40시간) 14. TwitterBootstrap 1/2 (생활코딩 작심40시간) 함수 안에 들어가서 탐색 가능... 10라인까지 작동하고 11라인부터 작동안함... 안에 계속들어가서 수정 (너무 깊다.. ㄷㄷ) 지구상에 바람의 움직임을 표기. HTML, CSS, Java Script뿐 만아니라, 대기중인 기술도 많음. 새로운 수업-------------------------------- 라이브러리 또다른 형태 twitter bootstrap (트위터에서 만든 기술 : 플랫폼이 되기 위함) 디자인과 개발을 동시에 잡음 (jQuery : 개발 취중) 반응형 웹 : 하나의 웹페이지를 잘 구현하면 여러 디바이스에 제공할 수 있음. 화면 줄이기 or 늘이기에 따라 레이아웃 구성이 달라짐.(같은 웹페이지) 2017. 1. 25.
13. jQuery 13. 라이브러리와 jquery 라이브러리 : 공통적 소스? 자주 찾는 정보를 쉽게 정리해 놓은 시스템! jQuery : 자바스크립트의 라이브러리(코드 양이 확 줄어듬) 대부분 jQuery로 이용 ( 광범위 사용 ) jQuery를 로드하는 법을 배움. (스크립트 오류뜸... 다운받으니) jQuery는 자바스크립트 언어 - Hello world!라는 것을 뒤집을려면 자바스크립트에서는 document. ~~~~~ 라고 길게 썼었는데 jquery이용하면 S('#target').html('World Hello'); 면 바로 처리 가능... 주석 (//)/* */ --> 자바스크립트는 코드가 많이 필요하다. --> jQuery는 그것을 축약시켜 줌. $ ( ) --> 함수 자바스크립트가 할 수 없는 일은 jQue.. 2017. 1. 25.
12. JavaScript 3/3 (생활코딩 작심40시간) 12. JavaScript 3/3 (생활코딩 작심40시간) 심기일전해서 다시~~ 설명하넹... (잠은 무서움... ㅋㅋ) ; : 세미 클론 명령이 끝난다는 거. f12에서 콘슬 히스토리가 남아있네... 화살표 위 누르면 똑같이 나옴. if 뒤에는 블린 형식만 올 수 있음. True False 만약 if (12){특정값} 출력 안됨. FALSE. #그런데 이게 무슨 효용임? 변수가 들어가면 효용이 있음. if 구간은 이미 고정하고, 변수 x=1 값만 조정하면 더이상 수정할 필요가 없다는 것임. if 구간은. 자바 스크립트 기능! prompt('password?'); 신기~ ㅎㅎ password? 를 묻는 prompt를 먼저 해석하여 경고창으로 alert 번호를 입력한게 경고창으로 +1 하면 11로 왜 2가.. 2017. 1. 24.
11. JavaScript 2/3 (생활코딩 작심40시간) PT 내용 설거지해보자!?? 설거지 하는 로봇 프로그래밍 설거지 해주세요 요청! --- 이 과정을 코드로 접시들(접시1, 접시2, 접시3) ---> 변수 x=1 (상수 : 변하지 않는 값) 만약, y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1;y = 1+1; 이런식으로 되어있는데, 앞에 있는 1을 10으로 바꿔야 한다면? 이 복잡한 로직에서 아주 곤란하다. 그렇기 떄문에 x = 1; 에서, x = 10으로 바꾸면 간단하기 때문에 변수가 있는것이다. 이 뜻. (저 텍스트는 웹페이지에서 설명창(스크립트) 뜨는 로직임) y = x+1;y = x+1;y = x+1;y = x+1;y = x+1;y = x+1;y = x+1;y = x.. 2017. 1. 24.
10. JavaScript 1/3 (생활코딩 작심40시간) 자바스크립트 - 소스트리(깃) 설치 html Tab -> script Tab alret("Hello world"); 치면 됨 (웹 페이지 안에 자바스크립트 삽입 방법) 에 사이에 있는 (inner : 안) 내용에 World Hello 라고 써라는 뜻. Ctrl Shift S = 똑같은 파일을 다른 이름으로 저장 input tab -> UI가 만들어짐 (검색) Web 출발 : 문서(HTML, CSS) 댓글이나 사용자 인터페이스에 의한 반응때문에 자바스크립트!, PHP 등 기술들이 등장. 단, 자바스크립트가 직접적으로 디자인에 관여하는 것은 아님. (통상 HTML CSS 수준이 요구 하는거에 반응) 정리) HTML은 웹페이지에서 정보, CSS는 디자인, Java script는 제어를 담당. (동적으로, 프로.. 2017. 1. 24.
9. CSS 3/3 (생활코딩 작심40시간) 복습) 선택자 복합선택자 ul li : li라는 태그를 최종적으로 선택, 분모가 ul인 놈만 찾는 거. 즉, 찾음(O) No 안찾음(X) ul, ol {} (ul ol 둘다 선택) 중복제거, 유지보수, 재활용성 (코드가 중복된다면,) #li>.li>li금은동 최신의 것이 우선순위li{} li{} 이미지 화면에 출력하는 법 이미지가 왼쪽으로 촥! img{float:left} --> 레이아웃 의미부여(검색엔진 - 분석) -> Nav 아티클 - 부분 헤더 오타 (header) /" 검색엔진 최적화 자바스크립트를 제목처럼 만들기 --- 테두리 head 태그 안에다가 #타이틀 태그는 제목역할임 박스 모델 적용 article에 float:left 주고, width:400px; 값을 주면 됨. 휴 끝! 2017. 1. 23.
8. CSS 2/3 (생활코딩 작심40시간) CSS 두번째 시간. (CSS는 디자인) 색깔별 우선순위 a F12 -> 좌측 상단에 Network 확인 이거 .. 2017. 1. 23.
7. CSS 1/3 (생활코딩 작심40시간) cascading style sheet css는 웹페이지에서 디자인을 담당. 디자인 역할. html은 정보, css는 디자인 기억! CSS 등장 배경 (원래 html만 있었음) 1. 시각적인 정보와 정보 자체를 설명하는 ol li가 폰트 컬러나 사이즈와 공존하다 보니까 관리하는게 너무 힘듬. 2. 시스템 체계를 이해하기 너무 힘듬 --> 현재는 CSS 한계에 직면하고 있어서 다른 기술이 막 터져나옴. CSS는 html 위에 있는 것임. SubText Prime html tab ul>li*5 Tab SubText Prime html tab head tag : 눈에 보이지는 않지만 키워드 같이 설명해주는 것임.body : 전체적 큰 틀. 신체는 보이고 정신은 안보이는 그런 메타포. style Tab : 지금.. 2017. 1. 22.
6. 버전관리와 Git 목적 : 버전 관리 시스템 (sun, git 등) : 팀 단위로 프로젝트 수행. 제품의 source Git : 명령어를 기반으로 하는 명령 system. 버전관리가 백업을 의미하기도 함. 질서를 유지하는 버전관리 시스템.(실무에서 아주 유용) # 검색창에 ?git ->https://git-scm.com/ source tree 검색 후, 다운 실행 (첫 페이지 I don`t, git 설치) 죄측 하단 Add (저장소) 준비된 상태 (다음 단계)Commit 버전이라는게 변경 사항이라, Commit(단축기 - 좌측 상단) 뭐가 바뀌었는지 적어줘야 함. 그 후, 커밋 누르면 버전관리 하나가 완성 된 것임. 수정 시작 - 제대로 버전관리가 되는지 아까와는 그림이 많이 다름 (초록색 물음표 -> 주황색) 수정사항이.. 2017. 1. 22.
HTML 3/3 서브프라임 텍스트 와의 플러그 인 개념을 배워 보았습니다. 먼저 View에서 Show Console 누른다. 패키지 메니저 설치라고 써있는 소스를 복사하여 Console에 붙여 넣기! 패키지 매니저 소스를 붙여넣은 화면 그다음 Ctrl Shift P 를 눌러서 pcl을 눌러 엔터를 친다. EMMET설치 하면 확장기능 설치가 완료됩니다. ul>li Tab을 누르고 화면을 확인 ul>li * 10 하면 화면과 같이 좌르르륵 나옵니다. Emmet 치트시트임 도구를 사용하면 얼마나 편한지를 보여주는 대목임 (플러그 인) 도구를 이용해서 편하게 코딩하면 좋아요! ㅎㅎㅎ P.S 내일부터 휴가 복귀라 큐ㅠㅠㅠㅠ 글쓰는 것은 무리일 것 같습니다. 1월 말에 마저 하도록 하죠 ㅎㅎㅎㅎ. 2016. 12. 30.
HTML 2/3 저 Java Script 라는 것이 제목이어서 h1 Tab 변수와 상수가 두번째 타이틀임. h2 Tab 왼쪽에 있는 것이 리스트인데 순서대로 보여줘야 하므로ol Tab li Tab 임 변수와 상수 안에 있는 정보는 계속 변하는 정보라서 자잘한 디자인이나 내용에 신경쓰는 것보다, 구조 짜는 법에 대해 배워야 하므로 생략. 이런식으로 표현 가능함. 재밌다... 이 그림은 소스 코드를 본 것인데 마우스 우클릭으로 볼 수 있음. 이건 utf-8로 클라이언트에게 통일해서 보여주는 것. 그 뭐지 서브라임 텍스트에서 뛰어쓰기 하고 싶을 떄 br / 이나 p Tab을 이용하여 가능함 (단락) 2016. 12. 30.
HTML 1/3 3강은 생각보다 긴 1시간 짜리입니다. 이번 수업에서 가장 중요한 서버와 클라이언트 개념에 대해 처음 알게 되었습니다. 서버(을) : 반응, 아파치 등 클라이언트(갑) : 요청, 웹브라우저(크롬, 인터넷) - HTML - Hyper Text Markup Language : 언어(약속), 굉장히 언어 체계가 쉽다고 합니다. (다른 언어보다) 정보, 링크 서브라임 텍스트 html - Tab, a(는 링크) - Tab Ctrl O - 저장된 파일 target이 있으면 새 탭이 열려서 나옴. - Heading 6까지 작아지고, 7부터는 보통 크기 글자로 (6까지 지원) - 수업의 리스트 (외우지 마세요... 자주 쓰면 자연스럽게 된다고 합니다.) li Tab - listol Tab : ordered (순서) l.. 2016. 12. 30.
개발도구와 서브라임텍스트 서브라임 텍스트 개발 도구로서 서브라임 텍스트 3를 받게 되었습니다. 처음에 다운받을 때 약간 애를 먹었네요. 메모장 vs 텍스트 편집기 서브라임 텍스트의 아주 아주 사소한 기본적인 기능들을 익혔습니다. View로 사이드 바를 숨기고 나타나게 하는 것 등등... 저장 ctrl S, 미니맵 20분이라 많이 짧네요. ㅎㅎ 2016. 12. 30.
생활코딩 오리엔테이션 전체적으로 어떤 서비스가 있는지 잘 설명해주고 있습니다. (코딩하기 좋은 날~ ^^) 수업의 목적 : 무엇을 모르는 지 알려주는 것. 생산성 APl (Aplication Programming Interface) Clound Computing App Store - 수수료 30% Open Source - 열려 있는 설계도 (굉장히 혁신적인 일) -> 어떻게 동작하고, 어떤 모습인지 정확히 메모장에 적는 것인데... 이것이 공유되고 있다는 뜻. 인스타그램/IBM 회사 비교 (직원 수/노벨 수상자 등...) 고속도로 하이패스 2016. 12. 30.
블로그 운영원칙 안녕하세요. 저는 23살 학생입니다. (95년생) 코딩/프로그래밍에 대하여 관심이 없었지만 사업가, 개발자로서 성장하고 싶은 저는 좀 더 원할한 커뮤니케이션을 위하여 이 분야에 흥미 위주로 공부해보기로 하였습니다. 무료로 공부할 수 있는 대표적인 곳이 오픈튜토리얼 생활코딩 인데요. https://opentutorials.org/ 코딩에 대해 아무것도 모르는 제가 여러 주제의 강의를 완주하면서 그려나가는 기록물이라고 보시면 되겠습니다. 아마 2017. 2 부터 본격적으로 진행하지 않을까 생각하고요. 시작은 미약할지라도, 그 끝은 창대하리라. 열심히 해보겠습니다. ^^ 공부 기록 위주로 블로그를 운영합니다. 2016. 12. 30.
반응형

티스토리툴바