세상의 모든 지식

0. 도입 안녕하세요! 오늘은 React 개발 환경 설치 방법에 대해서 알려드릴까 합니다! (앞으로 리액트 관련 강좌에서 써먹어야 하기 때문이죠!) 저는 요즘 React 개발에 푹 빠져 간단한 것들도 React와 Firebase를 이용해 개발하고 있습니다. 오늘 강의에서는 리액트 프로젝트를 쉽게 설치할 수 있는 도구인 create-react-app과 자바스크립트 프로젝트에서 패키지를 쉽게 관리할 수 있는 도구인 yarn을 설치할 것입니다. 그리고 마지막으로 리액트 프로젝트의 기본적인 구조를 살펴보는 것으로 마무리하겠습니다. 1. Node.js 설치하기 React는 javascript 기반의 프로젝트입니다. React.js 파일을 script 태그로 불러오는 방법도 있지만 이번 포스팅에서는 'create-..

0. 도입 안녕하세요! 개발을 할 때 디자인 시안이 없는 상태에서 작업을 시작하는 것은 무척이나 어려운 일입니다. (물론 디자인 시안이 있어도 그것을 똑같이 구현하는 것은 어렵습니다만.) 그래도 완전한 무에서 유를 창조하는 것 보다는 어느 정도 디자인 틀이 있으면 좋겠죠? 오늘은 디자인 아이디어를 얻을 수 있는 사이트를 몇 곳 알려드리려고 합니다. 1. Uplabs 과거 Material Up 이었던 이 사이트는 제가 가장 많이 사용하는 디자인 사이트 입니다! 웹, iOS, Android, 일러스트, 로고, 애니메이션 등 다양한 분야의 디자인들을 볼 수 있습니다. 그날그날 베스트 디자인들을 메인에서 보여주기 때문에 사이트에 방문해서 둘러보는 것만으로도 눈이 즐거운 사이트입니다. UpLabs의 검색 기능을 ..

0. 도입 프로그래밍 기술이 대세가 되면서 프로그래밍을 배우고 싶어 하는 사람들이 더 많아졌습니다! 프로그래밍에 대한 수요는 앞으로도 꾸준히 증가할 것이기 때문에 프로그래밍을 공부하는 것이 앞으로의 인생에 있어서 절.대. 손해가 될 일은 없을 겁니다. 자, 그러면. 프로그래밍을 배워야 하는데 과연 어떤 것을 먼저 시작해야 할까요? 어떤 언어를 먼저 공부해야 할까요? 오늘은 프로그래밍을 처음 시작하는 사람들은 위한 가이드라인을 제시하려고 합니다. 물론! 이 가이드라인은 저의 주관적인 의견에 따라 작성되었기 때문에 참고해주시고, 다른 사람들이 작성해 놓은 가이드라인도 함께 참고하시면 더 많은 도움이 될 것입니다! 1. 프로그래밍, 왜 공부해야 하는가? 모든 배움에는 이유가 있습니다. 학교에서 가르치는 일방적..

0. 도입 안녕하세요! 이번 시간에는 간단하게 부트스트랩의 기본 구성요소들을 이용해 포트폴리오 사이트를 만들어 보겠습니다. 완성된 결과물은 다음과 같은 모습입니다. 1. 포트폴리오 사이트 레이아웃 구성 저는 Adobe사의 UI/UX 디자인툴인 XD를 이용해 다음과 같은 레이아웃을 구성해 보았습니다. 실제 웹 디자인 작업에도 많이 사용되는 툴이기 때문에 알아두시면 좋을 것 같습니다. 기회가 된다면 XD에 대한 강좌도 올리도록 하겠습니다! 하지만 모두가 이런 높은 퀄리티의 웹 디자인이 있어야만 개발을 할 수 있는 것은 아닙니다. 실제로 저는 웹 디자인 시안 없이 작업하는 경우가 다반사고 막상 디자인이 주어진다고 해도 디자인과 100% 똑같이 개발하는 것은 거의 불가능에 가깝습니다. 때문에 저는 개발을 시작하..

0. 도입 오랜만에 돌아왔습니다! 오늘은 제가 가장 많이 사용하고 사랑하는 프레임워크 중 하나인 부트스트랩에 대한 강의를 해보겠습니다. 부트스트랩은 2010년에 처음 제작된 css 프레임워크입니다. 예전에 제작된 웹서비스들은 대부분 부트스트랩 3을 사용하고 있고, 현재 버전은 4.3.1입니다. 저희는 최신 버전의 부트스트랩을 이용하여 쉽고 빠르게 웹 개발을 해보도록 하겠습니다. 부트스트랩(Bootstrap) 공식 사이트 : https://getbootstrap.com/ 1. 프레임워크(Framework)란? 시작하기에 앞서 먼저 프레임워크(Framework)에 대하여 알아보겠습니다. 프레임워크의 사전적인 의미는 '뼈대'입니다. 건물을 지을 때, 혹은 어떤 프로젝트를 진행할 때 기초가 되는 틀이자 전체 작..

2019.05.27.(월) 경희대학교 학부생들을 대상으로 'Python for Beginners'라는 발표를 진행했습니다! 발표 자료 첨부할게요! 많이 공유해주세요! 발표자료 : https://drive.google.com/file/d/1BF7me1bV3erJ1kAKZ1uzbG2SQTVAzd5E/view?usp=sharing

0. 도입안녕하세요! '별별 웹 특강' 게시판에는 간단하게 만들어 볼 수 있는 프로젝트들을 올려 보려고 합니다! 정말로 간단간단하게 만들 수 있는 프로젝트 들이니까 부담 가지지 말구! 그리고 최대한 자세하게 설명해 보려고 하겠지만, 그래도 이해할 수 없으면 넘어가도 좋습니다! 앞으로 다른 웹 특강들을 하면서도 사용하게 될 것이기 때문에, 반복적으로 겪으면서 서로 친해지도록 해보세요! 결과물 우선, 우리가 만들게 될 결과물입니다! 디자인은 맥용 계산기를 참고 했습니다.나름의 스타일링도 하면서 신경 썼어요~ 그럼 함께 만들어 보도록 하죠. | 목차 |계산기 구조 만들기tablecolspan과 rowspan간단한 스타일링계산기에 식 입력 받기html 태그의 onclick 속성 사용하기javascript 함수와..