거북이의 IT 공부

프레임워크(Framework) - 웹 프레임워크 본문

Web/Web

프레임워크(Framework) - 웹 프레임워크

버니빈 2020. 8. 6. 23:22

프레임워크 '일정하게 짜여진 틀, 뼈대를 가지고 일한다'라는 느낌을 받아가면 되겠습니다.
일정한 형태의 틀, 부품을 가지고 다양한 형태의 결과물을 만드는 것! 이것이 바로 프레임워크입니다. 

 

소프트웨어 프레임워크는 개발에 필요한 화면구현, DB연동, 개발환경들의 공통적인 부분을 제공함으로서 개발 시간과 (인력)비용을 절감할 수 있게 해줍니다.
쉽게 말하면 프로그램 개발의 다양한 기능들을 통합적으로 제공한다

'특정 프로그램을 개발하기 위한 여러 요소들과 메뉴얼인 룰을 제공하는 프로그램'

프레임워크 vs 라이브러리

라이브러리 = 도구의 모음

프레임워크를 가지고 프로그램을 프레임워크에서 제공하는 요소와 그것을 사용하기 위한 규약을 지키면

그 밖에 나머지는 어떤 라이브러리를 가져다가 써도 어떤 패키지를 가져다가 써도 상관이 없는 것입니다.

프레임워크 (자동차 틀) vs 라이브러리 (자동차 부품들)

 

설명을 들으며 느끼셨을 테지만, 이 둘의 결정적인 차이는 바로 자유도입니다. 이것이 바로 프레임워크와 라이브러리의 결정적 차이죠. 

프레임워크를 가지고 프로그램을 만들기 시작하면 어떤 규약을 꼭 지키면서 만들어야합니다. 하지만 라이브러리는 도구입니다. 이 프레임워크가 가지고 있는 규약을 지키면서 나머지 자유로운 부분은 어떠한 도구를 써도 무방하다는 거죠. 

 

하지만 결국 둘 다 프로그램을 쉽게 만들기 위해서 만든 것들이라는 점에서 공통점이 있습니다.

 

웹 프레임워크에 대해서 아무 생각이 없다가 이렇게 자세하게 공부하니 몇가지가 눈에 보이기 시작한다.

일단 파이참에서 아래와 같이 프레임워크를 따로 설정하는 작업을 했던 것이다.

(pycharm, intelliJ는 IDE - 통합 개발 환경 == 코딩, 디버그, 컴파일, 배포 등 프로그램 개발에 관련된 모든 작업을 하나의 프로그램 안에서 처리하는 환경을 제공하는 소프트웨어를 말한다.)

 

프레임워크로 장고가 눈에 들어온다.

웹 프레임워크(= 웹 애플리케이션 프레임워크) 란, 동적인 웹페이지나 웹서비스 개발하는 과정에서 DB연동, 템플릿, 코드 재사용등의 어려움을 줄이는 것이 목적인 프레임워크를 말합니다. 아키텍처는 보통 MVC (모델-뷰-컨트롤러) 패턴을 따라 사용자 인터페이스와 백 엔드를 분리합니다.

 

웹 프레임워크(웹 애플리케이션 프레임워크) 종류

1. JAVA기반

Spring - 전자정부 표준프레임워크

 

2. JavaScripts 기반

Node.js - 자바스크립트를 활용 서버쪽까지 제어할 수 있는 프레임워크. 

네트워크 애플리케이션 개발에 사용되는 소프트웨어 플랫폼. 웹서버에서 아파치 등의 별도의 소프트웨어 없이 동작하는 것이 가능

 

Angular JS - 자바스크립트 기반의 오픈 소스 프론트엔드 웹 애플리케이션 프레임워크

웹 애플리케이션은 물론 모바일 웹, 네이티브 모바일과 데스크탑 애플리케이션까지 프론트엔드 개발에 필요한 대부분의 기능을 갖추고 있다.

 

React - 프론트엔드 라이브러리

  • JSX문법을 쓴다는 점이 가장 큰 특징!(물론 JS만 써도 된다) -> JS안에 HTML을 넣을 수 있는 문법.

  • virtual DOM도 중요한 React의 특징이다. 아래는 virtual DOM에 대한 명확한 설명이다.

*****DOM이란? (Document Object Model)

단어 그대로 문서 객체 모델 입니다.
우리가 사용하는 HTML 단위 하나하나를 객체로 생각한 모델 이라고 생각하면 될 것 같네요. 

 

출처 - https://velopert.com/3612 , 저 주소에 있는 유튜브가 기똥차게 잘 가르쳐준다!!

https://medium.com/wasd/%EA%B8%B0%EC%B4%88%EB%B6%80%ED%84%B0-%EB%B0%B0%EC%9A%B0%EB%8A%94-react-js-1531b18f7bb2

 

기초부터 배우는 React — Part 1

리액트에 대한 전반적인 설명과 특징

medium.com

 

Vue.Js - 웹 페이지(요즘은 웹 애플리케이션) 화면을 개발하기 위한 프론트엔드 프레임워크

  • 여타 다른 프론트엔드 프레임워크보다 배우기 쉽다는 장점이 있다.

  • 리엑트(virtual DOM를 쓴다)와 앵귤러라는 프레임워크의 장점들을 쏙 빼와서 더욱 빠르고 가볍게 만든 프레임워크라고 한다.

  • 이러한 뷰는 MVC 에서부터 파생된 MVVM(View Model) 패턴을 가진다 - 특이하게 뷰모델(View Model)을 가진다. : https://coding-start.tistory.com/213

 

*현 프로트엔드 3대장 웹 프레임워크 - Angular, React, Vue, 

 

 

3. Python 기반

Django - 고도의 데이터베이스 기반 웹사이트

 

Flask - Django보다 단순하고 가볍다.

 

4. Ruby 기반

Ruby on Rails

 

 

 

 

 

출처: https://sanctacrux.tistory.com/221 [키쉬의 세상 이야기]
출처: https://engkimbs.tistory.com/673 [새로비]

Comments