CSS의 개념과 기초 문법에 대해 학습하고 이를 이용해 Google 유사 클론 웹사이트(Joogle)를 만드는 학습 영상입니다. 영상에 나온 것 처럼 CSS를 모두 외워서 사용하는 것이 아니라 google에 검색하여 관련 내용을 찾아서 적용하시면 훨씬 시간을 아낄 수 있습니다. 또, Bootstrap, Materialize, Semantic UI 등 CSS를 미리 만들어 놓은 라이브러리를 이용하시면 조금 더 쉽게 원하는 사이트를 구축하실 수 있습니다. (MIT라이센스 - 상업적 이용 무료) Bootstrap: https://getbootstrap.com Materialize: https://materializecss.com Semantic-Ui: https://semantic-ui.com Codepen은..
이번 영상에서는 도메인(URL)이 뭔지 그 개념과 원리를 살펴보고 무료 도메인 제공 사이트인 freenom.com에서 나만의 도메인을 구입하여 내 사이트와 연결하는 것을 해보는 실습 강좌입니다. 영상 중간에 개인정보 보호를 위한 임시 E-mail 인증 꿀팁이 나와있으니 참고해주세요 :) - 프리넘 https://www.freenom.com - Netlify https://www.netlify.com/ - 내 사이트 5분만에 만들기 https://www.youtube.com/watch?v=LnGgndT308Q 안녕하세요! 누구나 배울 수 있는 쉬운 코딩 채널을 만들어가는 조코딩입니다. 이번 영상에서는 URL에 대해 다루어보고자 합니다. URL이 뭔지 살펴보고 나만의 url을 구매하여 내 사이트에 적용하는 ..
이번 영상에서는 네이버 웹마스터도구를 이용해 내가 만든 사이트가 네이버에 검색이 될 수 있도록 등록하는 영상입니다. 검색엔진의 원리에 대해 알아보고 robots.txt, sitemap.xml의 역할을 이해한 뒤 직접 제작하여 등록합니다. 또, SEO의 기본 개념에 대해 이해하고 간단히 적용하는 법을 배웁니다. 영상 마지막에 요약 정리 있으니 참고해주세요! *HTML 기초강의인데 왜 HTML 중심으로 다루지 않는 지 의문을 가진 분들이 계실텐데 궁극적인 목표는 웹 어플리케이션을 만드는 것이기에 HTML의 기본만 이해해도 할 수 있는 기초적이지만 유용한 것들을 먼저 다루고자 합니다. 추후 HTML&CSS 심화 강의를 통해 핵심 개념을 다루겠습니다. - 네이버 웹마스터도구 https://webmastertoo..
웹 사이트를 공개하는 디플로이의 원리를 살펴본 후 1강에서 배운 태그 지식을 활용해 나만의 웹 사이트를 HTML 무료 템플릿을 이용하여 간편하게 만들어보고 Netflify라는 웹 호스팅 서비스를 이용해 디플로이 하는 강좌입니다. 추가적으로 Github에 저장된 코드로 디플로이하게되면 소스코드를 수정하는데로 즉각 반영이 된다고 하니 정말 유용하네요! *HTML 템플릿 이용시 readme나 licence 파일을 꼭 확인하여 저작권에 문제가 없는지 유의해주세요! - Netflify 주소 https://www.netlify.com/ - 완성된 사이트 주소 https://jocoding.netlify.com/ 안녕하세요 누구나 배울 수 있는 쉬운 코딩 채널을 만들어가는 조코딩입니다. 이번 영상에서는 내가 만든 웹..
웹 개발의 가장 기본인 HTML의 태그에 대해 이해해보는 강좌입니다. HTML 태그의 기본에 대해 이해하고 크롬 개발자 도구를 이용해 실제 웹 사이트를 분석하고 기사 조작, 실시간 검색순위 조작을 통해 실습해보는 강좌입니다. 안녕하세요 누구나 배울 수 있는 쉬운 코딩 채널을 만들어가는 조코딩입니다. 이번 영상부터 HTML의 기본에 대해 함께 배워보겠습니다. HTML이란 지난 코딩 공부 순서 영상에서 말씀드렸던 것처럼 웹의 Front-End의 뼈대를 구성하는 언어입니다. 즉, 웹 페이지의 전체적인 구조가 어떻게 되어 있는지를 표시하는 마크업 언어인 것이죠. HTML은 Hyper Text Markup Language로 풀어쓰자면 하이퍼텍스트 하이퍼링크 들로 구성된, 마크업 웹페이지 구조가 어떻게 되어있는지 ..
웹 개발을 본격적으로 시작하기 앞서 필요한 프로그램을 설치하는 영상입니다. 웹 브라우저 및 코드 에디터를 함께 설치해보겠습니다. 안녕하세요 누구나 배울 수 있는 쉬운 코딩 채널을 만들어가는 조코딩입니다. 이번 영상에서는 컴퓨터 화면 녹화를 통해 인사드리게 되었네요. 지난 코딩 공부 순서 영상 보셨나요? 안 보신 분들을 위해 상단에 링크를 올려드리겠습니다. 위 영상에도 말씀드렸지만 코딩을 쉽고 재미있고 효율적으로 공부하기 위해서, 우리는 웹(Web) 프로그래밍을 공부해보겠습니다. 이번 영상에서는 본격적으로 코딩을 배우기 앞서 필요한 프로그램을 설치하는 과정을 보여드리도록 하겠습니다. 영상을 통해 함께 화면으로 보시죠! 먼저 인터넷 사이트를 볼 수 있게 해주는 “브라우저”를 설치해보겠습니다. 물론 윈도우를 ..
#코딩이란? #프로그래밍이란? #프로그래밍언어 #코딩언어 #기본용어정리 코딩, 프로그래밍 언어, 프레임워크, 라이브러리, API, SDK 등 어디서 많이 들어보셨는데 무슨 개념인지 잘 모르셨나요? 누구나 이해할 수 있도록 쉽게 설명해드리겠습니다 안녕하세요 누구나 배울 수 있는 쉬운 코딩 채널을 만들어가는 조코딩입니다.이번 영상에서는 코딩에 관련된 기본적인 용어를 정리해보도록 하겠습니다. 1. “코딩”이란 무엇인가?요즘 초등학교에서도 코딩 교육이 의무적으로 시행되고 있으며 4차 산업혁명에 핵심요소로 많이 언급되고 있습니다.도대체 코딩이 뭐길래 그런걸까요? “코딩”은 Code + ing의 합성어로 코드를 작성한다는 의미입니다. 여기서 코드는 컴퓨터가 알아들을 수 있는 언어로, 요약하자면 컴퓨터에게 명령하는 ..
#입문자코딩공부순서 #어떤언어부터배워야하나 #코딩의분야 저의 경험을 바탕으로 제작된 영상입니다.저는 웹, 앱 서비스를 만들고 싶어서 프로그래밍을 시작하였습니다.처음 배울 때 C언어가 가장 기본이라 하여 C언어부터 공부를 시작하였습니다. 그런데 너무 어려워서 저는 코딩에 재능이 없다고 생각했고 프로그래밍 공부를 접을까 생각도 하였습니다.그러나 막상 웹을 배우고 나서는 만들고 싶었던 웹, 앱 서비스를 만드는데 C언어의 어려운 개념은 사용되지 않았고 훨씬 쉽고 재미있게 만들 수 있었습니다. 그래서 공부를 처음부터 웹을 중심으로 한다면 더욱더 흥미롭게 시작할 수 있지 않을까 싶어 이러한 영상을 제작하게 되었습니다. INTRO. 여러분은 어떤 목적으로 코딩을 공부하려 하시나요?아마 많은 분들이 코딩을 배워서 내가..
우리가 코딩을 공부해야하는 이유? #코딩공부이유 #코딩배워서뭐하나 프로그래밍에 대해 아무것도 모르던 비전공자가 코딩을 배워나가면서 느낀 코딩 공부를 해야하는 이유 4가지를 정리해보았습니다.1. 코딩이 예전에 비해 정말 쉬워졌습니다.코딩 하면 굉장히 어렵게만 생각하는 분들이 많으실텐데요.. Assembly어 C언어와 같이 컴퓨터 전반에 대한 깊이 이해가 필요한 어려운 언어로 개발하던 때를 지나 요즘에는 초등학생들도 배운다는 Python, Ruby, JS와 같은 비교적 쉬운 언어 (고급 언어), 그리고 개발을 도와주는 프레임워크, 클라우드, api 등 다양한 도구들이 발전하여 정말 기본적인 코딩 지식만 있어도 어마어마한 서비스를 만들 수 있는 세상이 되었습니다.어느정도의 기본만 배우면 이미 만들어진 도구 및..