웹 사이트 프로젝트(Web Site Project)와 웹 응용프로그램 프로젝트(Web Application Project)의 차이

혹시 알고 넘어가는지 모르겠지만, 닷넷에서 웹 앱을 만드는 데 2가지 프로젝트 형식이 있다.
바로 웹 사이트 프로젝트와 웹 앱 프로젝트인데, 이 둘의 차이점은 간단하게 짚어보는 시간을 갖겠다.

웹 사이트 프로젝트(Web Site Project)

타 언어 웹 사이트로 치자면, ASP, PHP, 일반 JSP 페이지를 만드는 꼴이라고 보면 된다. VS 2005부터 소개되었다.
폴더 루트를 잡고, 거기에 페이지와 리소스, 백엔드 코드를 특정 폴더인 App_Code 에 넣는 방식이다.
프로젝트 생성이 빠르고, 단순하다. 그리고 프로젝트 파일도 생성하지 않는다. 그럼 구성 설정은 어디다가 저장하냐?
바로 솔루션 파일과 구성 설정 파일인 web.config에다 저장한다. 각기 역할은 당연히 틀리고 대부분 설정은 web.config에다 저장한다.
개발만 하고 폴더 그대로 IIS에 배포할 수 있다. 사이트 설정만 하면 작동을 시작한다. 나머진 IIS가 파싱하여,
각 페이지마다 변경 사항이 생길 때마다 컴파일 후, 각기 페이지마다 DLL 파일이 생성되어 페이지를 렌더링 한다.
그렇기 때문에 빠른 배포와 수정이 장점으로 통한다. 하지만 이런 특성이 단점으로 작용하는데,
이렇게 될 경우 각 페이지 내에서 클래스 네임 중복을 확인하지 않는다, IIS는 그걸 인식하지 않고 파일마다 컴파일 하기 때문에,
클래스 이름이 중복되더라도 다른 이름으로 클래스를 생성 후 컴파일하기 때문에 참조 등에서 어떤 문제가 나올 지 파악이 어렵다.
이런 불상사를 예방하기 위해 “게시” 기능이 있다. 게시할 때 “미리 컴파일(Precompiled)” 개념이 있으며, 최적화하고 정리하여 깔끔한 백엔드와 성능을 보장받을 수 있다.

이럴 때 웹 사이트를 쓰면 좋다. 프로토타입, 시연, 데모, 단순한 소개 사이트.

웹 응용프로그램 프로젝트(Web Application Project)

웹 앱을 아예 응용 프로그램처럼 프로그램 단위로 관리하고 운영하는 프로젝트로, VS2005 SP1부터 내장되었으며, 이런 개념은 이미 VS 2003부터 도입이 되었다.
폴더 루트에 .csproj.vbproj 등의 프로젝트 파일이 생기며, 프론트엔드 코드와 백엔드 코드를 아무 곳이나 넣을 수 있으며, 예외 설정 등이 가능하여
관리적 측면에서 아주 유리한 프로젝트이다. 왠만한 구성 설정은 프로젝트 파일에 저장하기 때문에 web.config 파일엔 서버 운영에 필수적인 구성 설정밖에 없는 것도 장점이다.
단점이라면, 매 수정시마다 빌드(컴파일)해줘야 하고, 당연히 컴파일된 상태로 배포를 해야 한다. 물론 아예 “게시”하여 배포할 수 있다.
빌드 후에는 모든 백엔드 코드가 하나의 DLL에 담게 된다. 배포 방식이야 웹 사이트처럼 폴더째로 담으면 땡이지만, 백엔드 코드를 DLL에서 바로 불러오기 때문에 성능 측면에서 이득이다.
또한 게시 기능을 통해 웹 사이트처럼 모든 페이지의 백엔드 코드까지 퉁쳐서 하나의 DLL로 담은 후 배포할 수 있기 때문에,
성능과 안정성 측면에서 당연히 가장 추천되는 웹 앱 프로젝트 방식이다.

이럴 때 웹 응용 프로그램을 쓰면 좋다. 웹 사이트에서 소개한 거 빼고 전부 다. 모든 서비스들 말이야.

결론?

참고로 ASP.NET Core 프로젝트는 웹 사이트 프로젝트가 아직 없다. 웹 앱 프로젝트 방식이다. ASP.NET 팀에서는 ASP.NET Core Web Pages 으로 만들고 있다.
닷넷 코어는 IIS 종속이 아니기 때문에 어떤 방식으로 배포하고 운영할 지는 모르겠으나, 어자피 정식 웹 앱을 만드는 데에는 웹 앱 프로젝트 만큼 관리가 좋은 건 없으니 그거 쓰자.
어자피 WebMatrix는 VS Code가 그 뒤를 계승 이미 끝났으니 신경 끄고.

composite / 2017년 8월 30일 / Piss Development / 0 Comments

내가 한번 추천해보는 웹 개발자를 위한 Visual Studio 확장 모음

페북 그룹에 Visual Studio 웹 개발자 추천 확장 모음 링크를 올렸길래 나도 올려본다. 여기에 기재된 확장 도구를 포함하여 내가 쓰고 왜 쓰는지 알리고자 글을 쓴다.
내가 설치한 확장 목록을 이름순으로 볼 수 있다보니 알파벳별로 정렬하는 점 양해 바란다.
아, MS에서 만든 확장은 제외다.

Code Alignment

이름만 봐도 눈치챈 사람도 있을 것이다. 말로 하긴 힘드니 아래 코드로 뭔 프로그램인지 알려주겠다.

    person.HomeTown = "Brisbane"; 
    person.FirstName = "Chris";                
    person.Surname = "McGrath";                
    person.Age = 24;                           
    person.Occupation = "Software Developer";  

=>  person.HomeTown   = "Brisbane";
=>  person.FirstName  = "Chris"; 
=>  person.Surname    = "McGrath"; 
=>  person.Age        = 24; 
=>  person.Occupation = "Software Developer"; 

올드비 개발자들(특히 C/C++ 개발자)에게 단비같은 확장도구인 데다가 무료이다. 도네이션웨어라는 점.
더이상 설명이 필요있나?

ColorSchemeSelector

ColorSchemeSelector

그저 단순한 색상 추출 도구라면 내가 블로그 보다 말았고 그냥 넘어갔겠지만, 이녀석은 그저 단순한 색상 추출기를 뛰어넘어 색상 혼합별로 색상을 추천받아 추출할 수 있다는 점에서 특히 웹 개발자와 디자이너에게 좋은 도구가 될 것이다.
아, 물론 무료다.

Git Diff Margin

Git Diff Margin

Git로 버전관리를 한다면 해당 줄에 바뀐 점을 이렇게 실시간으로 표현해준다는 점이 되겠다. 자주 바뀌는 일이 많은 버전관리 개발자라면 유용할 것이다.
이 확장 또한 링크된 블로그에 소개되어 있으며, 무료이다.

Grunt Launcher

프론트엔드 개발자라면 반드시 한번씩은 들었을 Grunt. 패키징 자동화로 유명한 Grunt와 스케줄별 자동화를 지원하는 Gulp, 프론트엔드의 패키지 매니저인 Bower 명령어까지 지원해준다.
나처럼 node.js를 수동으로 포터블로 설치한 환경이라면 사용 시 세팅에 유의하라.
무료라고. 소개됐다고.

Image Optimizer

프론트 엔드를 위한 확장이 여기 하나 또있다. Visual Studio 자체 지원 이미지 최적화 도구가 있다면 믿겠는가?
같은 이미지에서 이미지 사이즈를 줄여주는데, 자세한 내용은 이미지 최적화 기법 구글 검색 ㄱㄱ.
이미 node.js 등으로 이미지 최적화 확장이 있다면 비교해달라. 난 아직 비교 안해봤다.
무료다.

Mexedge Stylesheet Extension

간단하게 말하면, 스타일시트 소스를 트리구조로 시각화하는 도구다. 프론트엔드 개발자에게는 상당히 편리한 도구다.
확장 링크로 들어가서 스샷을 보면, 그저 단순한 그런 도구가 아니다. 심지어는 파일 내 클래스 목록처럼 표시까지 해준다.
블로그에서도 소개되어 있다. 3명이 기업 운영하고 있는 것으로 보이긴 한데 일단 무료니 그냥 써 주자.

MixEdit

지금 소개하는 확장은 내가 블로그에서도 소개한 바 있으며, 유일하게 무료가 아닌 평가판 확장이다.
Sublime Text를 접하다가 Visual Studio로 개발하다보면 답답하지 않는가? 멀티커서와 멀티셀렉트가 지원되는 확장, 변수를 한꺼번에 바꿀 수 있다면 얼마나 좋을까?
그런 목마름을 Visual Studio에서도 적셔주는 그런 확장 되시겠다.
평가판이긴 하지만 사용기능과 기간에 제한은 없다. 단지, Visual Studio 실행 후 처음 MixEdit 기능을 수행 시 구매 권유 창이 뜰 뿐이다.

Suggested Extensions

얜 좀 재밌는 확장이다. 블로그에 소개되긴 했는데 댓글에 소개된 확장인데, 파일 확장자별로 사용할 수 있는 Visual Studio 확장을 소개시켜주는 확장 되시겠다.
예를 들면 yaml 같은 파일들. IntelliJ IDEA 같은 개발 툴 쓴 사람은 알겠지만 JetBrains 에서는 확장자별로 지가 확장 추천을 해준다. 그런 비슷한 거다.
무료다.

Web Essentials 2015

만약 웹 개발자인 당신이 Visual Studio를 쓰고 있을 때, 이 확장을 쓰고 있다면 이 확장 제작자에게 큰 절을 해야 한다. 블로그에서도 소개도니 웹 개발자 필수 확장!
웹 개발에 모든 것을 제공해주는 확장이다. CSS, HTML, JS 편집에 날개를 달아주며, CoffeeScript, LESS, Sass 같은 확장 언어 편집과 Grunt, npm, bower 등의 설정 편집에 유용한 도구를 제공하는 웹 개발 만능 확장이다.

Visual Studio 2015 사용자에게 주의점은 소스 파일을 Minify하거나 Bundling으로 합치거나, Sass 및 LESS 컴파일 기능을 따로 확장으로 뺐다는 점에 유의해야 한다. 없다고 해매지 말고 내가 링크 소개할 테니 다운 받아라. 이 확장도 무료고 아래 확장도 무료다. 저거 제작자 만나면 반드시 큰 절 해라.

Bundler & Minifier
Web Compiler

나는 여기까지 추천 확장 목록으로 썼다.
여러분의 추천 확장이 있다면, 서슴없이 공유하여 서로 즐거운 개발 세상을 만들어가는 주역이 되길 바란다.
싫어? 싫음 시집가.
끗.

composite / 2015년 9월 9일 / Piss Development / 0 Comments