본문 바로가기

웹개발11

코드펜 Codepen에서 소스 연습도 하고, 코딩도 참고하고 코드펜 Codepen을 소개합니다. 학원에서 코딩을 배우면서 처음 코드펜 사이트를 알게 되었습니다. 아래의 url에 들어가서 많은 코드를 참고하였습니다. https://codepen.io/ CodePen An online code editor, learning environment, and community for front-end web development using HTML, CSS and JavaScript code snippets, projects, and web applications. codepen.io 다른 분들은 회원가입을 해서 주로 코딩 테스트를 할 때 코드펜을 많이 사용하는 것 같습니다. 저는 회원가입을 하지는 않고 주로 샘플을 찾거나 예시 소스를 참고하고자 할 때 코드펜에 들어갑니다.. 2020. 10. 11.
웹기획자와 앱기획자는 어떻게 다르고 어떻게 같을까? 웹기획자와 앱기획자는 같을까요? 다를까요? 웹과 앱은 다릅니다. 같은 이유로 웹기획자와 앱기획자도 다른 점은 있습니다. 웹과 앱이 다르기 대문에 업무에서 요구되는 기본지식과 UI 및 전체 과정의 시나리오를 그리는 것이 달라집니다. 프로세스 플로우를 그리는 것도 다를거구요. 마인드매핑을 하면서 중점을 두는 부분도 다를거구요. UI설계서를 그릴 때 고려해야할 사항도 다를테니까요. 하지만 웹이나 앱이나 기획자의 입장에서는 팀원들이 목적된 서비스(웹페이지, 앱 프로그램)를 잘 구현할 수 있도록 이해시켜야 한다는 주된 역할은 동일하다고 생각합니다. 본인은 웹기획에서 일하기 때문에 앱기획자의 정확한 업무는 모르지만 이런 같은 점과 저런 다른 점이 있다고 생각을 합니다. 2020. 10. 9.
기획자와 PM(Product Manager)은 같을까요? 다를까요? 기획자와 PM의 차이점은? 어떻게 다른가? 기획자와 발주사가 단순히 상상속에서만 가능하고 실제 구현이 불가능하거나, 사실상 실현되기 어려운 기능을 무리하게 주장하고 추진하지 않게 어느정도 높은 수준의 전문적인 지식과 경력을 가지고 의사결정을 하는 것이 PM이라고 생각합니다. 단순히 발주사, 디자이너, 개발자 사이에서 중간역할을 하는 것이 기획자라고 하면, PM은 좀 더 높은 의사결정을 가지고 업무를 정리 및 조정을 해주고 전체 팀(조직)을 이끌어가는 사람이죠. 높은 수준의 업무지식과 경력을 가지고 있기 때문에 발주사와 디지이너, 개발자 사이에서 겉도는 문제를 잘 풀어내기도 합니다. 항해하는 선박에서 비유를 하자면 기획자가 능력있는 갑판장이라고 하면, PM은 전체를 이끌어가는 선장이라고 할 수 있겠죠. 선.. 2020. 10. 9.
마운트 Mount가 뭐야? 마운트란? What is mount? 마운트(mount)는 유닉스(Unix)계열 운영체제의 명령어입니다. 하드디스크 같은 물리적인 장지를 특정위치, 즉 디렉토리에 연결시켜 주는 것을 마운트라고 합니다. 윈도우에서는 마운트가 자동으로 되어서 컴퓨터 사용자들이 마운트를 몰라도 되지만, 리눅스 등의 경우 관리자가 직접 특정 디렉토리에 붙이는 작업을 수행해야 합니다. 이전에 CD를 이용해서 스타크래프트 등의 게임을 할 때 가상 CD 드라이브를 마운트 하기도 했습니다. 리눅스를 아직 배우지 못해서 마운트 명령어를 실제로 어떻게 사용하는지는 잘 몰라서 간단히 의미만 설명하였습니다. 2020. 10. 9.
UNIX 명령어 간단 정리 UNIX 명령어들을 간단히 정리합니다. 프로세스 관련 명령어 fork : 새로운 프로세스를 생성합니다. exec : 새로운 프로세스를 수행합니다. exit : 프로세스 수행을 종료합니다. wait : fork 후 exec에 의해 실행되는 프로세스의 상위 프로세스가 하위 프로세스 종료 등의 event를 기다립니다. kill : 프로세스를 제거합니다. getpid : 자신의 프로세스 아이디를 얻습니다. getppid : 부모 프로세스 아이디를 얻습니다. & : 백그라운드 처리를 위해 명령의 끝에 입력합니다. signal : 신호를 받았을 때 프로세스가 취할 동작을 지정합니다. pipe : 프로세스 간 통신을 위한 경로를 설정합니다. 파일 및 디렉터리 관련 명령어와 기타 명령어들입니다. create : 파일을.. 2020. 10. 8.
통합개발환경 IDE (Intergrated Development Environment) 통합개발환경 IDE (Intergrated Development Environment) IDE는 개발에 필요한 다양한 도구들이 결합되어 있는 소프트웨어로 소스 편집기, 컴파일러, 디버거, 배포 등 프로그램 개발에 관련된 모든 작업을 하나의 프로그램 안에서 처리하는 환경을 제공하는 소프트웨어를 의미합니다. 또한 코딩 에디터에서 확장기능을 인스톨하여 사용할 수 있는 것처럼 IDE도 추가 기능을 인스톨하여 필요한 기능들을 확장할 수 있습니다. 비쥬얼스튜디오코드는 코딩 에디터이지만, 비쥬얼스튜디오에서도 IDE를 다운로드 받아 활용할 수 있습니다. 비쥬얼스튜디오 IDE에서는 파일트리, 에디터, 터미널이 한 화면에서 실행이 됩니다. 2020. 10. 6.
API(Application Programming Interface) API(Application Programming Interface) API(Application Programming Interface)는 운영체제 등 큰 틀에서 지원해 주는 함수의 집합군을 이야기 합니다. interface라는 단어처럼 중간의 매개체를 뜻합니다. 오픈 API api하면서 많이 언급하는게 오픈 api입니다. 구글지도, 카카오맵 등 다양한 지도 api도 오픈 api입니다. 누구나 쉽게 접근할 수 있는 웹서비스에 적용하여 서비스 개발에 필요한 인터페이스를 공개하고 공유하는 것을 오픈 API라고 합니다. 오픈 api를 이용하고자 하면, 데이터 또는 서비스를 제공하는 측, 즉 오픈 api를 제공하는 측에서 정한 규칙을 지켜야 합니다. 오픈 API를 이용하는 사용자들은 자신들의 축적된 데이터 없.. 2020. 10. 6.
시큐어코딩 Secure Coding에 대하여 시큐어코딩 Secure Coding 이란? 시큐어 코딩의 정의는 다음과 같습니다. 시큐어 코딩이란 안전한 소프트웨어 개발을 위해 소스 코드 등에 존재할 수 있는 잠재적인 보안 취약점을 제거하고, 보안을 고려하여 기능을 설계 및 구현하는 등 소프트웨어 개발 과정에서 지켜야 할 일련의 보안 활동을 말합니다. 소프트웨어(SW)를 개발함에 있어 개발자의 실수, 논리적 오류 등으로 인해 SW에 내포될 수 있는 보안취약점(vulnerability)을 배제하기 위한 코딩 기법을 뜻 한다. 코딩을 할 때 프로그램의 제약이 있는 것이 아니므로 메모장으로도 시큐어 코딩을 할 수 있습니다. 다만 좋은 IDE(인텔리제이, 이클리스 등)을 사용 하는 경우 놓칠 수 있는 오류를 경고해 주기 때문에 시큐어 코딩에 도움이 될 수 있.. 2020. 10. 6.
웹접근성 자가진단 도구 : WATCH 2.0 웹 접근성 자동 진단, 웹접근성 자가진단 도구 WATCH 2.0을 소개합니다. Watch2.0을 이용하면 한국형 웹 콘텐츠 접근성 지침 2.1에 다른 6개 세부 항목에 대한 웹 접근성 준수 여부를 편리하게 자가 진단할 수 있습니다. www.webwatch.or.kr/accessibility/040301.html?MenuCD=431 WATCH2.0 | 솔루션 | 정보 접근성 | WebWatch - 웹 접근성 품질인증 No.1 / APP, SW 접근성 인증·컨설팅 WATCH2.0 WATCH2.0 소개 WATCH2.0은 등록된 웹사이트 URL 및 오프라인 웹문서에 대한 웹 접근성 및 웹표준 준수여부를 자동 진단하는 자가 진단툴입니다. 한국형 웹 콘텐츠 접근성 지침 2.1에 따라 웹 사�� www.webwatc.. 2020. 10. 6.
무설치 포토샵 픽슬러 에디터 소개 사진 에디터, 포토샵의 기능을 무료로 온라인에서 사용하기 포토샵이 설치되지 않은 PC에서 포토샵 작업을 해야할 때 아주 유용한 사이트 하나를 소개합니다. 픽슬러 에디터, 온라인 포토샵으로 부르고 있습니다. url은 아래와 같습니다. https://pixlr.com/kr/ 온라인 사진 에디터 - Pixlr.com 무료 & 프리미엄 온라인 사진 에디터를 만나보세요. 효과, 필터, 오버레이, 간단한 기능부터 고급형 기능까지 모두 담았어요. 대부분의 파일 형식 (PSD, PXD, JPeg, PNG - 투명, webP, SVG 등)을 지원해요. pixlr.com 실제 포토샵 작업환경과 상당히 유사해서 포토샵을 할 줄 알면 바로 사용이 가능합니다. 2020. 10. 2.
전자정부 표준프레임워크 전자정부 표준프레임워크란? 전자정부 표준프레임워크는 정보시스템 개발·운영 시 필요한 기본 기능을 미리 구현한 것을 기반으로 개발하는 방식으로 정보화 투자 효율성 향상을 달성하고, 전자정부 서비스의 품질향상을 제공합니다. 이는 공공부문 정보화 사업 시 적용되는 개발 프레임워크 운용 SW 표준화, 품질 및 재 사용성 향상을 지원합니다. 출처 : https://www.hanshinit.co.kr/www/index.do 대표홈페이지에 오신 것을 환영합니다. WORK 웹사이트를 구축하는 데 있어서 보다 효과적인 (주)한신정보기술만의 서비스를 제공합니다. www.hanshinit.co.kr 2020. 10. 1.