본문으로 건너뛰기

지금 주목해야 할 2024년 웹 개발 트렌드 Top 4

Hailie
· 약 25분

오늘날 소프트웨어 엔지니어링 분야는 끊임없이 변화하고 있습니다. 그중에서도 웹 개발은 변화 속도가 가장 빠른 분야 중 하나인데요. 해가 바뀌면서 IT 업계는 올해 웹 개발 트렌드를 두고 다양한 전망을 제시하고 있습니다. 이 글에서는 업계에서 전망한 2024년 여러 웹 개발 트렌드 가운데 가장 큰 영향력을 미칠 걸로 예상되는 4가지 트렌드를 살펴보겠습니다.

‘이미지→코드’ 생성형 AI 도구 등장

2024-01-31-development-trends-0 | 인포그랩 GitLab

오늘날 인공지능(AI) 성능은 하루가 다르게 숨 쉬듯 발전하고 있죠. 특히 생성형 AI 기술은 코드 작성, 리뷰 등 개발 업무에 활용돼 업무 생산성을 높일 핵심 기술로 기대를 모으는데요. 이미 IT 업계에는 생성형 AI 대표 도구로 OpenAI의 ChatGPT, GitHub의 Copilot, Google의 Bard와 Gemini, Meta의 LLaMA, Amazon의 Q와 같은 LLM(Large Language Model: 거대언어모델)이 나와 있습니다. 이 가운데 ChatGPT나 Copilot은 현재 개발 업무를 수행하는 데 활발히 쓰이고 있죠.

이러한 생성형 AI 도구를 사용할 때는 자연어로 채팅하며 AI 모델과 상호작용했는데요. 예를 들면, 텍스트로 프롬프트를 입력해 결과물을 텍스트, 이미지, 오디오 형태로 얻는 방식이죠. 이 방식은 편리하지만 언제나 최선은 아닙니다. 텍스트로 프롬프트를 입력해 원하는 결과물을 출력하려면 조건이 까다롭고요. 이 과정에서 프롬프트를 여러 차례 수정해야 해 번거롭죠. 이에 생성형 AI 기술을 개발 업무에 활용했을 때 업무 효율성과 생산성을 늘 향상한다고 보장하기 어려울 수도 있습니다.

다행히도 AI 모델과 상호작용하는 방식은 다양해지고 있습니다. 텍스트로 프롬프트를 입력하지 않아도 이미지만 제시하면 AI 모델과 더 빠르고 직관적으로 상호작용해 원하는 결과물을 출력하는 도구도 나오고 있죠. 요즘은 이미지를 입력하면 AI 모델이 코드를 자동 생성하는 사례도 있는데요. 예를 들어, 영국 IT 기업 tldraw는 스케치를 코드로 변환하는 기능을 선보였습니다. 이 회사 소프트웨어 tldraw의 화이트보드에 그래프를 그린 다음, ‘Make Real’ 버튼을 누르면 그래프를 Matplotlib 코드로 바로 변환할 수 있죠.

이뿐만이 아닙니다. 미국 IT 기업 Vercel은 AI 기반 UI 시스템 v0를 공개했는데요. 이는 웹사이트의 가격표 스크린샷을 입력하면 AI로 몇 초 안에 이를 코드로 변환합니다. 아울러 v0는 코드를 출력해 사용자가 특정 부분을 수정하도록 지원하고요. 이는 shadcn/ui와 Tailwind CSS에 기반해 쉽게 복사하고 붙여 넣을 수 있는 React 코드도 생성하죠. 특히 v0는 “프론트엔드 개발의 종말”이라는 평까지 받으며 소프트웨어 엔지니어 사이에서 이미 화제가 되고 있습니다.

이미지를 입력하면 코드를 생성하는 AI 도구는 2024년에도 계속 나올 걸로 전망되는데요. 이는 개발 업무의 생산성과 효율성을 높이되 소프트웨어 엔지니어에게는 새로운 도전이 될 걸로 예상됩니다. 이미지를 활용하면 텍스트보다 더 쉽고 직관적으로 AI 모델과 상호작용해 원하는 코드를 빠르게 출력하는 데 도움이 될 수 있죠. 그러나 AI 모델에서 필요한 결과물을 신속하게 얻으려면 이미지를 최적의 상태로 입력해야 하고요. 이러한 도구가 소프트웨어 엔지니어 자리를 위협할 가능성, 이를 잘 활용해 엔지니어의 경쟁력을 더 높일 방안을 고민하며 실력도 향상해야 합니다.

프로그레시브 웹 앱(PWA) 도입 확산

2024-01-31-development-trends-1 | 인포그랩 GitLab

프로그레시브 웹 앱(Progressive Web Apps, PWA)은 모바일 앱과 비슷한 환경을 제공하는 웹용으로 개발된 앱입니다. PWA는 웹과 네이티브 앱의 장점을 결합했는데요. 이는 모바일 기기의 웹 환경에서도 네이티브 앱과 같은 수준으로 사용자 경험을 누리도록 지원하죠. PWA는 서비스 워커, 웹 앱 매니페스트, 최신 브라우저 기능으로 사용자에게 오프라인 지원, 푸시 알림, 홈 화면 추가 기능을 제공합니다. 즉, 서비스 워커로 애플리케이션 리소스와 데이터를 캐시 하면 인터넷에 연결되지 않아도 PWA가 작동하고요. PWA에서 푸시 알림을 수신하도록 선택하여 사용자 참여도와 유지율도 높일 수 있죠. 또 PWA를 사용자 장치에 설치하면 홈 화면에서 앱에 쉽게 접근할 수 있고요.

PWA에는 다음 장점이 있는데요. 첫째, 이는 앞서 언급했다시피 오프라인 접근 가능성, 푸시 알림, 빠른 로딩을 지원하여 사용자 경험을 향상합니다. 둘째, PWA는 모바일 우선 접근 방식을 취해 모바일 기기에서 편리한 사용자 경험을 제공하고요. 셋째, 이는 단일 코드 베이스를 사용하여 다양한 플랫폼에서 작동돼 네이티브 앱보다 개발·유지 관리 비용을 줄일 수 있죠. 넷째, PWA는 저대역폭이나 불안정한 네트워크 환경에서도 앱 접근성을 높여주고요.

다섯째, 사용자는 앱 스토어를 거치지 않고도 PWA를 쉽게 설치할 수 있고, 개발자는 앱 스토어의 승인 과정 없이 업데이트를 직접 배포할 수 있습니다. 여섯째, PWA는 검색 엔진에서 인덱싱할 수 있어 SEO에 유리하고, 온라인 가시성도 개선하죠. 일곱째, 이는 HTTPS를 통한 보안 연결을 사용하기에 사용자 데이터를 안전하게 보호합니다. 여덟째, PWA는 기능이 잘 작동하고, 효율적인 애플리케이션으로 발전하고 있어 사용자와 기업이 이용하기에 두루 유익하죠.

2024년에도 PWA는 중요성을 인정받아 업계에 널리 도입될 걸로 예상됩니다. 여기에는 애플, 마이크로소프트와 같은 빅테크 기업의 움직임도 영향을 주는데요. 애플은 지속적인 iOS 업데이트로 PWA를 발전시키는 데 기여하고 있고요. PWA로 네이티브 앱과 비슷한 환경을 지원합니다. 안드로이드와 비교할 때, iOS에서는 푸시 알림, Safari 외 브라우저 지원이 제한되지만 이는 업데이트로 점차 개선되고 있죠. 아울러 마이크로소프트가 Microsoft Store에 PWA를 무료로 게시하도록 지원하기로 했는데요. 이렇듯 시장에서 영향력이 높은 빅테크 기업이 PWA를 적극 지원하고 있고요. PWA는 여기에 힘입어 2024년에도 IT 업계에서 입지를 더 공고히 다질 걸로 전망됩니다.

PWA의 장점도 올해 IT 업계에서 이 기술의 입지를 넓히는 데 이바지할 걸로 보이죠. 기업에서는 사용자의 빠른 접근성과 편의성을 도모하기 위해 PWA를 채택할 가능성이 높고요. 특히 모바일 인터넷이 더 확산되고, 사용자가 온라인, 모바일 환경에서 더 편리한 경험을 원하면서 PWA는 중요한 기술 전략이 될 걸로 관측됩니다. 특히 코로나19 팬데믹 이후 디지털 전환이 가속화되고, 디지털 전환 비용의 최적화 요구는 높아지고 있는데요. PWA는 비용 효율적이고 성능까지 우수하기에 수요는 더 늘어날 수 있습니다.

서버리스 아키텍처(Serverless Architecture) 활용 증가

2024-01-31-development-trends-2 | 인포그랩 GitLab

서버리스 아키텍처(Function as a service)는 클라우드 공급자가 관리하는 환경에서 애플리케이션을 개발하고 배포하는 방법입니다. 여기서는 개발자가 서버를 직접 프로비저닝하거나 관리하지 않는데요. 이는 전통적인 서버 기반의 웹 애플리케이션 개발, 배포 방식과 다르죠. 서버리스 아키텍처를 활용하면 서버 관리 부담을 줄이고, 클라우드 기반 서비스를 활용해 인프라를 관리할 수 있습니다. 이로써 개발자는 애플리케이션 개발에 더 집중할 수 있죠. 서버리스 아키텍처는 오늘날 웹 개발의 핵심 기술로 자리매김하고 있습니다.

이미 IT 업계에서는 AWS Lambda, Azure Functions, Google Cloud Functions가 서버리스 아키텍처 관련 서비스로 활발히 쓰이고 있는데요. 넷플릭스는 비디오 인코딩, 사용자 인증 처리, 백엔드 프로세스 관리 업무에 AWS Lambda를 사용하죠. 사용자가 동영상을 올리면 람다 함수가 트리거돼 콘텐츠를 여러 기기에서 스트리밍하기에 적합한, 다양한 포맷으로 인코딩하고 처리하고요. 이로써 넷플릭스는 서버를 프로비저닝하거나 관리하지 않고 수요에 기반해 리소스를 동적으로 확장할 수 있습니다. 그 결과, 비용을 최적화하면서 사용자에게 원활한 스트리밍 경험을 제공할 수 있고요.

스포티파이는 Google Cloud Functions를 활용해 음악 스트리밍 플랫폼 안에서 여러 백엔드 작업을 처리합니다. 함수는 트리거돼 사용자 인증을 관리하고, 사용자가 생성한 콘텐츠를 처리하며, 음악 추천 알고리즘을 위한 백엔드 작업을 수행하죠. IBM 계열사인 더 웨더 컴퍼니는 IBM Cloud Functions로 대규모 날씨 데이터를 처리하고 분석합니다. 이때 서버리스 기능이 실시간 데이터를 처리하고 예측을 생성하며, 위치에 기반해 사용자에게 개인화된 날씨 알림을 전달하고요.

2024년에도 서버리스 아키텍처는 업계에서 필요성을 인정받아 적극적으로 도입될 걸로 예상되는데요. 이유는 다음과 같습니다. 첫째, 클라우드 컴퓨팅 기술이 발전하면서 서버리스 서비스의 기능과 성능은 더 향상되고 있는데요. 이로써 기업은 서버리스 아키텍처를 더 쉽고 편리하게 이용할 수 있죠. 둘째, 서버리스 아키텍처는 사용한 만큼 비용을 내는 모델을 채택하는데요. 비즈니스 요구사항이 동적으로 바뀌는 기업이 서버리스 아키텍처를 이용하면 비용을 절감할 수 있습니다. 셋째, 서버리스 아키텍처는 개발자가 서버 관리의 부담 없이 애플리케이션 로직에 집중하도록 지원하죠. 그 결과, 애플리케이션을 빠르게 개발하고 배포해 시장 변화에 더 신속하게 대응할 수 있고요.

넷째, 서버리스 아키텍처는 자동으로 확장되고 축소되며, 트래픽 변동에 따라 자원을 동적으로 할당합니다. 이는 높은 트래픽을 예측할 수 없는 애플리케이션에 적합하고요. 다섯째, 서버리스 아키텍처를 사용할 때 클라우드 제공업체가 서버 보안을 관리하는데요. 이로써 개발자는 애플리케이션 보안에 더 집중하고, 전체 시스템의 보안도 강화할 수 있죠. 여섯째, 서버리스 아키텍처는 대규모 데이터를 처리하고, 다양한 사물인터넷(IoT) 기기와 효율적으로 통신을 관리하는 데 도움이 되는데요. 이는 급증하는 빅데이터를 처리하고, IoT 애플리케이션에 활용하기가 좋습니다.

자동화에 힘입은 CI/CD 활성화

2024-01-31-development-trends-3 | 인포그랩 GitLab

지속적 통합(CI)과 지속적 배포(CD)의 중요성은 현대 웹 개발에서 이루 말할 수 없죠. CI는 개발자가 코드 변경 사항을 공유 저장소에 정기적으로 통합(merge)하는 건데요. 이로써 여러 개발자의 작업을 실시간으로 통합하고, 문제도 조기에 발견할 수 있습니다. CI 과정에서는 코드 통합 후 단위 테스트, 통합 테스트, 기능 테스트 등이 자동으로 실행되죠. CD는 테스트를 통과한 코드를 자동으로 프로덕션 환경에 배포하는 건데요. 이는 사람 개입을 최소화하고, 배포 과정의 신뢰성을 높입니다.

이렇듯 CI/CD는 개발 프로세스를 자동화해 개발자가 더 빠르고 효율적으로 개발하도록 지원하는데요. 이는 버그를 빠르게 찾아 수정하고, 제품 완성도를 높여 시장에 이를 신속하게 출시하는 데 도움이 되죠. 참고로 인포그랩에서는 GitLab CI 도구로 CI/CD를 실행하는데요. 이는 개발팀이 더 빠르고 생산성 높게 작업하며, 코드 품질과 안정성을 유지하도록 합니다. GitLab CI 도구를 활용하면 테스트 화면을 보고 초기 단계에서 버그를 발견하며 수정할 수 있는데요. 이는 프로젝트 비용을 절감하는 데 유용하죠.

2024년에도 CI/CD는 개발 업무에서 활발히 쓰일 걸로 전망되는데요. 이유는 다음과 같습니다. 첫째, 디지털 전환과 급변하는 시장 환경에 대응하려면 기업이 제품을 더 신속하게 효율적으로 개발하고 출시해야 하는데요. CI/CD는 코드 통합, 테스트, 배포를 자동화하기에 여기서 핵심 역할을 수행할 수 있죠. 둘째, 오늘날 소프트웨어가 복잡해지면서 수동 테스트와 통합 접근 방식만으로 버그를 관리하고 품질을 유지하려면 복잡한데요. CI/CD는 자동화 기능으로 이 업무를 간소화하기에 꼭 필요합니다.

셋째, 시장과 고객 요구사항은 끊임없이 변화하죠. CI/CD를 개발 프로세스에 활용하면 이는 코드 통합, 테스트, 배포를 자동화하므로 피드백을 제품 개선에 빠르게 반영하는 데 도움이 됩니다. 넷째, 요즘은 원격 근무가 일반화되고 직원들이 분산되면서 개발팀이 멀리서도 잘 협업하고, 업무를 효율적으로 수행해야 하는데요. CI/CD의 자동화 기능은 시공간에 구애받지 않고 팀이 원만하게 협업하며 업무 효율성을 유지하도록 지원합니다. 다섯째, 보안과 컴플라이언스는 소프트웨어 개발에서 특히 중요하죠. CI/CD는 테스트 자동화로 보안 취약점을 신속하게 파악할 수 있는데요. 이는 문제를 빠르게 해결하고 컴플라이언스를 지키는 데 도움이 됩니다.

맺음말

지금까지 2024년 웹 개발 트렌드 4가지를 살펴보았습니다. 오늘날 소프트웨어 엔지니어링 분야는 빠르게 발전하고 있고요. 기술 진보와 혁신은 기업과 개발자에게 다양한 가능성을 제시합니다. 앞서 살펴본 웹 개발 트렌드 기술인 ‘이미지→코드’ 생성형 AI 도구, PWA, 서버리스 아키텍처, CI/CD는 소프트웨어를 더 신속하게 효율적으로 개발하도록 지원하고요. 이는 더 편리한 사용자 경험을 제공하는 데 도움을 줄 수 있습니다.

먼저 ‘이미지→코드’ 생성형 AI 도구는 AI와 사람이 더 편리하게 상호 작용하도록 지원하고요. 이는 개발 업무의 생산성을 높이되 엔지니어에게 새로운 도전이 될 걸로 전망됩니다. 아울러 PWA는 모바일 사용자에게 뛰어난 사용 경험을, 개발자에게는 유연하고 효율적인 앱 개발 환경을 제공할 걸로 관측되고요. 이는 사용자 참여를 늘리고, 소프트웨어의 성능을 향상해 기업 비즈니스에 긍정적인 영향을 미칠 수 있죠.

또 서버리스 아키텍처는 개발자가 인프라 관리의 부담 없이 개발에 집중하도록 돕습니다. 이는 현재 동영상, 음악 스트리밍 서비스의 편의성을 높이는 데 기여하고 있고요. 앞으로도 IT 업계에 적극 도입될 걸로 예상됩니다. 마지막으로 CI/CD는 개발 프로세스를 혁신하고 속도와 안정성을 동시에 보장하는 중요한 요소인데요. 이는 개발자가 빠른 개발과 배포로 시장에 제품을 신속히 선보이도록 지원하기에 개발 업무에서 널리 쓰일 걸로 보입니다.

2024년은 이러한 기술에 힘입어 소프트웨어 엔지니어링의 혁신과 발전이 기대되는 해입니다. 우리 모두 함께 트렌드 기술을 대비하고, 업무에 적극 활용해 보고요. 더 나은 개발과 혁신의 길을 만들어 가봅시다.

인포그랩은 GitLab 및 DevOps에 대한 맞춤 기술 지원을 제공합니다. GitLab(Omnibus/Cloud Native Hybrid) 구축 관련한 지원이 필요하시면 문의하기로 연락 주십시오.

참고 자료

1.Frontend predictions for 2024

2.7 Web Development Trends for 2024

3.Top 15 Software Development Trends to Watch in 2024

4.PWA on iOS - Current Status & Limitations for Users [2024]

5.Digital development trends of 2024

6.Web Development Trends of 2024