전남 메타스쿨의 기존 메인사이트에는 자주 사용하는 사이트들이나 즐겨찾기로 추가한 사이트들의 이름과 아이콘들을 다 노출되어있었다. 하지만 메인 사이트에 노출 되는 부분은 클래스 운영, 교수 학습자료, 독서인문교육, 에듀테크 활용, 에듀테크 이해하기 이렇게 5개의 글자와 아이콘만 노출이 되고 클릭 시 크게 5가지로 분할된 상태에서 하위로 관련 사이트들의 이름과 아이콘이 노출되게 변경해달라고 했다. 그리고 클릭해서 들어오게 된 부분에는 배경색을 줘야했다.
고안한 방법은 앞에서 클릭한 값을 URL에 Query Parameter로 붙여서 넘긴 다음 자주 사용하는 사이트 페이지에서 Query Parameter에 있는 값을 가져온 후 스타일을 주는 방법을 생각했다. 또한 선생님, 학생, 학부모마다 보여지는 갯수가 달라지므로 userType을 붙여서 보여지고 안보여지고를 설정했다.

URI
Uniform Resource Identifier : 통합 자원 식별자
네트워크 상의 리소스를 식별할 수 있는 식별자
위의 사진과 같이 URI 의 하위 개념으로 URL과 URN 이 있음.
URL
Uniform Resource Locator : Web Address, 웹 주소
리소스를 리소스의 경로 기반으로 식별하는 식별자
Resouce의 정확한 위치 정보 = 파일의 위치
웹에서 정해진 유일한 자원의 위치 정보가 담긴 주소. 자원에는 HTML, CSS, 이미지 등이 정적 자원으로 해당
흔히 URL은 웹사이트를 찾기 위함이라고 생각할 수 있으나 더 넓은 의미인 자원(Resource)를 찾기 위함이다.
- 네트워크 상에 존재하는 자원의 위치
- 리소스가 어디에 있고 어떻게 접근 할 수 있는지 알려주는 역할 → 프로토콜등을 포함하기 때문
- 도메인에 프로토콜이 들어가 있다면 URI 이자 URL
- 만일 리소스의 위치가 변경된다면 해당 URL로는 리소스를 찾을 수 없음.
URL 구조

URN
Uniform Resource Name : 통합 자원 이름
리소스를 리소스의 고유한 이름을 통해 식별하는 식별자
- 이름으로 리소스를 특정하는 URI
- URN은 리소스 자체에 부여된 name 이며 변하지 않게 유지 가능
- 독립적인 자원 지시자이기 때문에 리소스가 이동해도 항상 리소스를 가리킬 수 있음.
- 리소스가 그 이름을 변하지 않게 유지하는 한, 여러 종류의 네트워크 접속 프로토콜로 접근해도 문제없음.
URI vs URL
- URI는 식별하고 URL은 자원의 주소를 가리킨다.
흔히 공부를 하기위해 검색을 하다 보면, URI 와 URL의 차이로 URI이지만 URL은 아닌 경우, URL만 맞는 경우로 예시를 들어 올린다. 예를 들어
1 | |
이런 경우 index가 정확한 자원의 주소가 아니라 내부적으로 rewrite를 통해 index.html을 식별함으로 이는 URI 이지만 URL은 아니다 라는 경우가 있는데,
내 생각으로는 index가 폴더이든 파일이든 특정 리소스에 접근할 수 있는 위치를 나타내므로 URL이고 URL을 포함하고 있는 상위개념은 URI 이기때문에 URL 이자 URI가 되지 않을까 생각한다.
또한 URL만 맞는 경우는 거의 없고 대부분이 URL이자 URI이지 않을까..? 그리고 URI이지만 URL인 경우의 예시는 URL과 겹치지 않는 부분이 있는 URN으로 예시를 들 수 있지 않을까 생각해봤다.
1 | |
URL vs URN
- URL은 Protocol 포함
Protocol//Domain:Port/Path/Page?Parameter - URL은 리소스를 리소스의 경로 기반으로 식별하는 URI
- URN은 특정 리소스의 고유한 이름을 통해 식별하는 URI
정리
URI
- 네트워크 상의 리소스를 식별할 수 있는 식별자 전체
- URI의 하위 개념으로 URL, URN
URL
- 리소스를 리소스의 경로를 통해 식별
- URL은 일반적으로 4가지 요소로 구성. (Protocol, Host Name = Domain, Port 번호, path or query)
URN
- 리소스를 리소스의 고유한 이름을 통해 식별
- 대부분 사용하지 않으며 흔히 말하는 URI는 URL을 말함.