절차지향 과 객체지향 

프로그래밍을 하기에 앞서 절차 지향이란 무엇이며 객체 지향이란 무엇인지

알고 프로그래밍을 할 필요가 있습니다.

절차지향과 객체지향 서로 무엇이다르며 지금은 왜 객체 지향을 쓰고있는지 

알아 보겠습니다.

 

객체지향이 나오기 이전 절차 지향 부터 알아보겠습니다.

 

절차 지향이란 (Procedural Programming )

Procedural Programming 이라 하며 Procedural 란 말은 여기서 절차라는 말은 오역이라고 합니다.

여기서 Procedural란

  • 프로그래밍에서 프로시저는 루틴이나,서브루틴 즉 함수이다. 

 

그렇다면 우리가 알고 있는 절차지향 은 순차적으로 내려가는게 아니라는걸까요?

 

모든 프로그램은 순차적으로 내려갑니다 그렇다고 객체지향이 아래에서 위로 코드를 읽지않는다는건 누구나 아는 사실입니다.

 

Procedural Programming 코드를 함수 또는 절차라는 작은 단위로 분할하여 재사용하기 쉽고 실행 흐름이 위에서 아래로 진행되도록합니다. 이 스타일은 이해하고 구현하기 쉽습니다. 

즉 함수 호출을 통해 추상화와 재사용성을 높이는 것이  Procedural Programming 입니다.

 

 

객체지향이란 (Object Oriented Programming)

객체 지향 기법 (Object Oriented Programming)의 정의를 보면 실제세계를 모델링한 소프트웨어 개발론이라고 나와있습니다.

그렇다면 실제 세계를 어떻게 개발한것이며 어떻게 프로그래밍을 해야 객체지향이라고 하는것일까요?

객체지향을 알려면 일단 객체 라는 것이 무엇인지 알아야 합니다.

객체(object)란

데이터(속성)과 이 데이터를 처리하귀위한 함수(메소드)를 결합 시킨 실체입니다.

실제 세계를 모델링을 한것이 객체지향기법이니 실제 세계를 표현해 

데이터 와 메소드를 설명 드리겠습니다.

여기서 객체 의 속성이라고 하면 그 사물이 가지고있는 고유한 데이터 입니다.

얘를 들면 요즘 핫한 일론머스크의 속성은 나이,키, 재산 , 학력 등등이있습니다.

그렇다면 메소드는 어떤것이있을까요. 일론머스크가 행동하는 것을 메소드라고 할수있겟습니다.

하지만 객체지향이란것은 이렇게 간단히 설명할수 없습니다.

 

 

 

즉 속성은 객체들이 가지고 있는 데이터값을 단위별로 정의한것이고,

메소드는 구체적인 연산을 정의한것입니다.

 

 

 

 

 

저작자표시

'개발 > 개발지식' 카테고리의 다른 글

변수(Variable)란  (0) 2021.04.21
W3C  (0) 2021.04.17
하루하루 읽다보면 늘어가는 개발지식 조엘 온 소프트웨어편 4-1  (0) 2021.04.12

HTML 은 웹의 문서 

CSS 는 웹의 디자인

JavaScript 는 웹의 동적인 부분을 표현하고 있습니다.

그럼 이 JavaScript 는 어디서 어떻게 탄생 되었을 까요

1990년대 최초 그래픽기반의 웹브라우저 넷스케이프 회사에서

Brendan Erich(브랜든 아이크)

Brendan Erich(브랜든 아이크) 개발자가 최초로 발표하였습니다.

처음 JavaScript의 이름 은 Mocha 였다  LiveScript로 바뀌었다 최종적으 JavaScript로 바뀌었습니다.

오늘날 JavaScript 는 프론트앤드에서는 없어서는 안될 언어이며 서버쪽으로 영역을 확장해

더욱 비중이 커진 언어입니다.

저작자표시

웹사이트나 티스토리를 보면 배경을 색으로 지정 해놓은 것이 아닌 

이미지를 배경으로 한곳을 종종 볼수 있습니다 . 이번에는

색이아닌 background 로 이미지를 넣는 방법을 배워보도록 하겠습니다.

 

원하는 이미지를 html이 저장되어 있는 폴더에 옮겨놓고 진행 하시면 됩니다.

 

<!DOCTYPE HTML>
<html>
<head>
<meta charset = "utf-8">
</head>
<body style=" background-image :url(unnamed.jpg);
  background-size : 100%; " >


	<h1 style=" background-color: #3B1E1E;"> CSS 기초배우기 </h1>


</body>
</html>

저는 바디 태그에 백그라운드에 이미지를 첨부하겠습니다 .명령어는 다음 과같습니다

background-image : url (이미지파일이름) ;

그리고 이미지가 화면테 꽉차게 나올수 있다록 백그라운드 사이즈를 100%르 사용하였습니다.

 

 

결과 값은 이렇게 나왔습니다 구글에 검색 기본 배경화면입니다 필요하신분은

unnamed.jpg
1.04MB

이 사진을 사용하시면됩니다.

저작자표시

'개발 > CSS' 카테고리의 다른 글

css (배경) 기초 2편  (0) 2021.04.17
CSS (글자색) 기초 1편  (0) 2021.04.17
CSS 기초  (0) 2021.04.17

저번 블로그에서는 글자 색을 변경 해보았습니다. 그러면 저희는 이제

배경 색을 바꾸는 법을 알아보겠습니다. CSS 에서는 배경색을 background 라고합니다.

태그 style 안에 background-color : " 색상" 이라고 작성 해주시면 됩니다.

저는 <body>태그와 <h1> 태그의 배경 색을 변경 해보겠습니다.

 

 

컬러를 지정해주는 방식은 3가지가 있습니다.

  1. 텍스트로 색을 지정해주는방식
  2. RGB값으로 지정해주는방식
  3. RGB의 HEX값으로 지정해주는 방식이 있습니다.

그럼 순서대로 설정해주는 코드를 보여드리겟습니다.

 

1. 텍스트로 색을 지정해주는 방식

<body style="background-color : green">


	<h1 style="background-color : blue"> CSS 기초배우기 </h1>


</body>

바디 태그와 h1 태그에 안에 style 속성을 사용하여 색을 텍스트로 적어 두었습니다 .

 

이렇게 결과 가 나오신걸 볼수 있습니다.

 

2. RGB값으로 지정해주는 방식

<body style=" background-color: rgb(175, 240, 184);">


	<h1 style=" background-color: rgb(211, 240, 175);"> CSS 기초배우기 </h1>


</body>

저는 RGB 값을 눈으로 확인 하고 싶어 구글에 RGB To Hex를 검색하여 일일이 색을 확인하고 RGB값을 넣었습니다.

그리고 코드의 결과 입니다.

3. RGB의 HEX값으로 지정해주는 방식

 2.번에 있었던 RGB To Hex 를 이용을 하셔서 Hex 값을 확인 한후 적용하는 방식이 있습니다 

코드를 보겠습니다.

 

<body style=" background-color: #FAE100;">


	<h1 style=" background-color: #3B1E1E;"> CSS 기초배우기 </h1>


</body>

 

이렇게 나온걸 확인 할수있습니다. 

그리고 한가 지 팁을 드리면 3번째 HEx 컬러에 있는 rgb 값은 카카오톡 로고 의 색입니다.

이 정확한 색을 어떻게 알수 있는지는

enjoymylife93.tistory.com/30

 

Microsoft PowerToy

얼마전 유투브에서 소개해준 마이크로소프트 PowerToy 프로그램 리뷰를 보았다 . 아직 정식 출시 한것이 아니라 컴퓨터 운영체제에는 안들어있는 프로그램이다. 그래서 github 홈페이지를 들어가서

enjoymylife93.tistory.com

이 프로그램을 이용하면 마우스 끝에 있는 rgb 값을 확인해주는 프로그램으로 확인하여 작성 하였습니다.

 

이상입니다. 감사합니다.

저작자표시

'개발 > CSS' 카테고리의 다른 글

css (배경 1-2) 기초 2-1편  (0) 2021.04.18
CSS (글자색) 기초 1편  (0) 2021.04.17
CSS 기초  (0) 2021.04.17

CSS는 HTML을 기본지식으로 두고있으며 CSS를 공부하려면 HTML을 공부하고 진행하셔야 사용가능합니다.

이번 기초 1편에서는 글자의 색깔 을 바꾸는 것을 해보겠습니다.

일단 CSS 을 사용하려면 HTML태그에 Style을 사용 써주셔야합니다.

 

일단 제목의 색깔을 초록색으로 바꿔 보겠습니다 문법은 이렇습니다.

<!DOCTYPE HTML>
<html>
<head>
<meta charset = "utf-8">
</head>
<body>

	<h1 style="color: green"> CSS 기초배우기 </h1>


</body>
</html>

 

style 안에 color : green 이라고 해주었습니다 이게 다입니다. 

결과 는 아래 사진에있습니다.

 

저작자표시

'개발 > CSS' 카테고리의 다른 글

css (배경 1-2) 기초 2-1편  (0) 2021.04.18
css (배경) 기초 2편  (0) 2021.04.17
CSS 기초  (0) 2021.04.17

HTML 은 웹문서를 만드는 가장 기초적인 Text와 태그 HyperText로 이루어져있습니다.

하지만 이것만으로는 웹을 만드는 소비자들에게는 불만이있었습니다. 그건 바로 디자인 면이 부족했습니다.

그래서 CSS 가 W3C에서 1996년 발표 되었습니다.

CSS 란 Cascading Style Sheets 의 약자로써 디자인과 선택자를 사용하여 더욱 태그들을 구별하기 쉽고

다양하게 디자인을 가능하게 해주는 언어입니다.

 

CSS 를 통해 폰트 여백 여러 디자인 측면을 갖출수 있게 해주었습니다.

현재 저희는 CSS 선택자로 속성명과 속성으로 이루어져있습니다.

 

저작자표시

'개발 > CSS' 카테고리의 다른 글

css (배경 1-2) 기초 2-1편  (0) 2021.04.18
css (배경) 기초 2편  (0) 2021.04.17
CSS (글자색) 기초 1편  (0) 2021.04.17

W3C 란 World Wide Web Consortium 의 약자입니다.

W 가 3개가 들어 가있고 뒤에 Consortium 의 앞글자를 따 W3C입니다.

그러면 W3C는 무엇일가요 HTML 창시가 팀버너스리 중심으로 1994년 설립되었습니다.

 

그렇다면 W3C는 무슨일을 할까요. 웹기술의 표준을 정의합니다.

W3C에서 CSS 가 탄생햇습니다. 

더욱 자세한 내용은 ko.wikipedia.org/wiki/W3C 이쪽을 참고하시는게 더욱 도움이 됩니다.

저작자표시

'개발 > 개발지식' 카테고리의 다른 글

변수(Variable)란  (0) 2021.04.21
절차지향과 객체지향 (본문수정중)  (0) 2021.04.21
하루하루 읽다보면 늘어가는 개발지식 조엘 온 소프트웨어편 4-1  (0) 2021.04.12

얼마전 유투브에서 소개해준 마이크로소프트 PowerToy 프로그램 리뷰를 보았다 .

아직 정식 출시 한것이 아니라 컴퓨터 운영체제에는 안들어있는 프로그램이다.

그래서 github 홈페이지를 들어가서 다운을 받아보았다 .

1주일 사용하고 좋아서 이블로그에도 올려 놓아야겠다 결심했다.

 

aka.ms/installpowertoys

 

Release Release v0.35.0 · microsoft/PowerToys

Our goals for v0.35 release cycle were to add in new functionality to support quick swapping layouts for FancyZones, wrap up work for the DirectShow migration for Video Conference Mute so we can mi...

github.com

이쪽으로 들어가면 쉽게 다운받을수 있다 대체로 기능은 이런게 있다.

  • colorPicker 라고 이기능을 사용하면 마우스끝쪽에 있는 색상 rgb값을 얻을수 있다 이걸보고 아 이걸 사용하면 웹이나 다른 프로그램을 디자인할때 원하는 색상 이쁜 색상의 rgb값을 쉽게 얻을수있구나 생각했다.
  • 그리고 또 마음에 들었던점은 화면 분할 설정이다 . 마이크로소프트에서 화면 분할 할수있는 종류는 좌 우 그리고 4분할이다 하지만 PowerToys 프로그램을 사용하면 새로로 3분할을 할수있고 여러가지 화면분할을 설정 할수 있어서 좋았던것 같다.
  • 그리고 또하나 마음에 들었던 기능중 하나 Alt + Tab을 눌르면 

이렇게 간단히 실행할수있는 검색기능이 나온다. 이걸로 궁금한게 있으면 바로 단축키를 눌러 chrom을 띄울수도있다

기능은 많으니 인터넷에 찾아서 쓰는게 좋을것같다.

 

저작자표시

+ Recent posts

티스토리툴바