JavaScript

Dev

DB에서 상대적 위치 값을 활용해 드래그 앤 드롭으로 인한 순서 변경 처리하기

최근 나는 드래그 기반의 계획표 서비스인 'DRAG ME'를 개발하고 있다. 우리 서비스의 특징은, 이름에서도 알 수 있듯이 '드래그' 기능이 굉장히 많이 사용된다는 점이다. 특정 계획에 대한 시간을 설정할 때, 특정 계획을 다른 날짜로 이동할 때 모두 드래그 기능이 사용된다. 다양한 드래그 기능들 중, 로직을 구성하고 DB를 설계하는 데 가장 많은 고민을 들였던 부분 중 하나가 바로 '드래그 앤 드롭'으로 인한 순서 변경이었다. 오늘 글에서는 이 기능을 구현하는 과정에서 직면했던 문제를 소개하고, 이를 어떻게 구현했는지에 대해 소개하려고 한다. 아래 화면에서, 사용자는 표지판 모양의 계획블록을 통해 계획을 세우고 시간을 관리할 수 있다. 그리고 이 계획블록들은, '해당 영역' 내에서 순서 변경이 가능하..

Dev

WEB2 - JavaScript / WEB2 - CSS

Web1 - HTML & Internet 완강 후 바로 Web2 - JavaScript 강의를 듣기 시작했다. 다음 강의라 확실히 Web1보다는 수준이 있었는데, 코딩을 많이 접해본 나에게 어려운 수준은 아니었다. 조건문, 반복문, 배열, 함수 등 학교를 다닐 때 배웠던 내용들을 자바스크립트를 통해 구현해볼 수 있었다. 또 HTML만을 이용해 만들었던 웹은 정적이었지만, JavaScript를 적용해 유저가 직접 변화를 줄 수 있는 동적인 웹으로 변화했기에 더욱 재밌었다. 강의 분량이 Web1보다 꽤 길었는데, 몰입해 듣다보니 금방 끝났다. 여담으로, 이 수업을 통해 "HTML은 프로그래밍 언어가 아니다"라는 말의 정확한 이유를 배우기도 했다. 다음 강의로는 Web2 - CSS를 선택했다. 장기적 목표였던..

Dev

JavaScript란 무엇인가?

JavaScript는 프로그래밍 언어의 하나로, HTML, CSS와 함께 웹을 구성하는 중요한 요소 중 하나이며 웹 애플리케이션에서 동작을 담당한다. 기본적으로 코드가 한 줄 씩 실행되는 인터프리터 언어이며, JIT(Just-in-time) 컴파일 방식으로 실행될 수도 있다. 자바스크립트는 원래 프론트엔드(클라이언트 사이드) 프로그래밍에 많이 사용되었지만, 최근에는 Node.js라는 플랫폼의 등장으로 백엔드(서버 사이드) 프로그래밍에도 많이 사용된다. 또한 웹을 벗어난 애플리케이션 개발에도 사용되고 있다. 자바스크립트를 기반으로 한 수 많은 라이브러리 / 프레임워크의 등장으로 커뮤니티가 활성화되어 있고, 현 시점 가장 많은 개발자들이 사용하는 언어 중 하나이다. React : 자바스크립트 라이브러리의 일..

HYOSITIVE
'JavaScript' 태그의 글 목록