분류 전체보기(16)
-
[스파르타코딩클럽] 1주차 10번째 - Javascript 맛보기
> 자바스크립트란? 모든 인터넷이 표준으로 약속한 언어입니다. 브라우저가 알아들을 수 있는 언어라고 보면됩니다. 웹 페이지에서 움직이는 것들을 만들고 제어하는 언어라고 보면됩니다. > Java하고 Javascript는 대체 무슨 관계인가? 인도하고 인도네시아와 같아. 바다하고 바다코끼리라고 보면 되. 즉, 양자는 아무 상관이 없다는 뜻 입니다. > 로 닫음. > 구글 크롬에서 마우스 오른쪽 버튼 누르고 > > '검사' 누르고 >> 'console' 누르면 뜨는 창이 Pycharm에서 로 닫는 부분이랑 동일함. > 변수 및 기본연산 변수를 대입( a = 2 )한다는 것은? "오른쪽에 있는 것을 왼쪽에 넣는 것!" (2를 a라는 변수에 넣는다) let으로 변수를 선언합니다. let a = 2 사칙연산, 그리..
2022.10.31 -
[스파르타코딩클럽] 1주차 9번째 - 포스팅 박스 완성하기
예제가 계속 나옵니다. 모르는 코딩에 익숙해져야 하기 때문에 어쩔 수 없이 계속 풀어보면서 익숙해지는 방법을 사용하는 것 같습니다. 이번 예제는 부트스트랩을 사용하여 '위 웹페이지 제목' 와 '아래 카드 4개' 사이 가운데 포스팅 박스를 만들어보는 것입니다. > 가운데 큰 박스는 별도의 를 다시 만들어서 생성하고 이름을 'mypost'로 지정해 줍니다. 이 때, 박스 크기나 위치를 확인하기 위해서, background-color를 사용해주시면 좋습니다. > 박스 테두리에 box-shadow 명령을 활용해 그림자 효과를 줘서, 박스 테두리가 보이도록 하고, 안에 들어갈 내용들의 간격도 padding을 활용해 미리 조절해 놓습니다. 그림자 효과: box-shadow 0px 0px 3px 0px gray; 안..
2022.10.31 -
[스파르타코딩클럽] 1주차 8번째 - 본격적으로 부트스트랩 써보기
자 또 다른 예제의 등장입니다. 점점 예제 수준이 올라가고 있습니다. 부트스트랩을 사용해서 아래와 같은 웹페이지를 만드는 것이 목표입니다. > 우선 지난 시간(1주차 7번째 시간)에 만들어놓은 코딩을 그대로 사용합니다. 기억이 안나면 다시 돌아가서 한번 복습합니다. https://finestreet-greenzone.tistory.com/62 [스파르타코딩클럽] 1주차 7번째 - 부트스트랩(예쁜 CSS 모음집) > 그렇게 말하는 부트스트랩이란 뭔가요? bootstrap(부트스트랩)이란, 예쁜 CSS 모음집이다 라고 생각하시면 됩니다. 즉, 부트스트랩은 이미 누군가가 예쁘게 디자인해서 만들어 놓은 웹 개발용 객 finestreet-greenzone.tistory.com > 부트스트랩에서 아래와 같이 .ro..
2022.10.31 -
[스파르타코딩클럽] 1주차 7번째 - 부트스트랩(예쁜 CSS 모음집)
> 그렇게 말하는 부트스트랩이란 뭔가요? bootstrap(부트스트랩)이란, 예쁜 CSS 모음집이다 라고 생각하시면 됩니다. 즉, 부트스트랩은 이미 누군가가 예쁘게 디자인해서 만들어 놓은 웹 개발용 객체들을 모아둔 곳이라고 보시면 됩니다. 무료로 제공되므로, 아래의 링크를 클릭해서 들어가서 한번 구경해 보시는 것도 좋습니다. https://getbootstrap.com/docs/5.0/components/buttons/ Buttons Use Bootstrap’s custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more. getbootstrap.com 어떤가요? 굉장..
2022.10.31 -
[스파르타코딩클럽] 1주차 6번째 - 폰트, 주석, 파일분리
예쁜 글꼴을 가져와서 웹페이지에 적용할 수 있는 방법, 주석 달기 및 파일 분리에 대해 배워봅니다. > 폰트는 구글웹폰트에서 제공하는 무료 라이선스 폰트를 활용합니다. https://fonts.google.com/?subset=korean Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com (폰트 저작권은 잘 지키셔야 합니다. 폰트 자체가 하나의 프로그램으로 취급되서 그렇습니다. 나중에 기회가 되면 폰트 저작권 관련 내용도 올려보도록 할께요~) 아래 사진과 같이, 구글 폰트 페이지에 들어가서, 원하는 폰트를 선택해봅니다. Select OOOO 항목을 찾아서 클릭합니다. 링크란에..
2022.10.30 -
[스파르타코딩클럽] 1주차 5번째 - 자주 쓰는 CSS 연습하기(2)
앞서 만들어 본 로그인 페이지가 지금 웹페이지의 왼쪽으로 치우쳐져 있잖아요~ 이걸 가운데로 가져와보는 예제입니다. 객체의 양쪽 여백을 동일하게 만든다는 것으로 이해하면 된다고 합니다. 를 사용해서 가운데로 가져오고 싶은 객체들을 다시 묶습니다. 그리고, class를 활용해서 다시 새롭게 설정한 에 이름표를 붙여줍니다. 꽉 차있는 객체는 먼저 가로 길이를 width로 줘서 공간을 만든다. margin: auto를 사용해서 상하좌우 여백을 맞춘다. 휴, 짧은 시간 안에 정말 많은 걸 배운 느낌입니다. 아...근데 아직 1주차의 절반도 못 왔..... 붓을 쥘 줄 아는 것과, 예쁘게 그림을 그릴 줄 아는 건 다른 이야기다. by 이범규 튜터 허허헣허헣헣 뼈때리는 소리네요. 그렇긴하죠. 예술적 감각이 있어야 예..
2022.10.30