ougi FE

최근에 프로젝트를 하나 하게 되었는데 FrontEnd 친구가 Svelte를 말하는 것을 보고배워보고 싶어 이렇게 글을 쓰게 되었습니다 Svelte해지기 위해 Svelte를 사용해볼까요?Svelte란 무엇일까? Svelte는 JavaScript의 라이브러리 중 하나로 React보다 가볍고 Vue보다 쉽다는 여러 좋은 장점들을 가지고 있습니다Svelte는 영어로 날씬하다라는 뜻도 가지고 있다고 합니다 장점학습 곡선이 낮습니다빠른 개발 속도가 올라갑니다렌더링 성능이 일정합니다단점느린 빌드 속도를 가졌습니다아직 React나 Vue 만큼 많이 쓰이지 않아 커뮤니티가 작습니다TypeScript가 Svelte의 신규 문법을 잘 따라가지 못하는 경향이 있다고 합니다다른 라이브러리들과의 차이점구조svelte는 다른 라이..

안녕하세요 조금 늦었지만 2024년도를 돌아보며 회고록을 작성하고 2025년도 계획을 세우고자 이렇게 글을 써보게 되었습니다☃️ 1~3월제가 이 광주소프트웨어마이스터고등학교에 들어오려고 다짐한 이유는초등학교 4학년 때부터 하던 배구선수를 부상으로 인해 그만두고 일반계를 갈 생각에 막막하기도 하고부모님에게 부담을 주지 않고 기숙사 생활을 하며 새로운 것을 제대로 해보고 싶어이렇게 이 학교에 들어오겠다고 다짐 했었습니다 저는 1월에 8기 디스코드방에 들어가게 되어 친구들이 나누는 대화를 살펴보다가처음으로 html, css, javascript에 존재에 대해서 알게 되었습니다어쩌면 저에게 큰 행운이었던 것 같습니다생활코딩이라는 분의 강의를 2번씩 돌려보면서 저는 그 3가지에 대해 공부하기 시작 했었습니다htt..

안녕하세요 오늘은 제가 최근에 제가 좋아하는 게임인 사과게임을 따라서 만들어보았는데 이 게임을 만드는 과정에 대해서 글을 써보고 싶어 이렇게 글을 써보게 되었습니다저는 토마토 버전으로 만들어보았습니다 ㅎㅎ사과 게임 소개사과게임이란 주어진 시간 안에 랜덤한 숫자 값이 들어있는 사과들을 없애는 것이 목표인 게임인데 사과를 없앨 수 있는 조건은 드래그 해서 생긴 네모 칸 안에 숫자 값들이 합해서 10이 되는게 조건입니다사과 한개 당 1점을 받습니다만드는 과정 과정을 나누어 보자면 크게 이렇게 나누어 구현 했던 것 같습니다시간 타이머 바 구현하기토마토들에 1-9까지 랜덤한 값을 주어 canvas에 그리기드래그하면 네모 칸 만들어지게 하기네모 칸 안에 숫자들이 10 되는지 확인하고 되면 사과를 없애고 점수 올라가..

오늘은 제가 앱잼에 나가게 되어 웹을 앱으로 만드는 방법을 살펴보다가 이렇게 글을 쓰게 되었습니다저는 평소에 react native를 배워서 웹 앱 말고 react native를 사용해서 앱을 개발해왔었는데웹 앱도 많은 장점이 있다고 하여서 배워보게 되었습니다웹을 앱으로 바꾸는 여러 많은 방법들이 있지만 저는 오늘 PWA에 대해 설명해보겠습니다❓ PWA란?PWA는 웹 기술을 가지고 모바일 네이티브 앱과 비슷하게 만들 수 있는 기술입니다 모바일 웹 사이트와 앱의 중간 형태로 모바일 앱과 웹 사이트의 장점을 결합하여사용자 친화적인 앱 경험을 제공할 수 있다고 합니다🌸 장단점장점빠른 성능을 제공한다고 합니다앱스토어를 거치지 않아도 웹 브라우저에서 바로 앱을 사용할 수 있습니다업데이트도 자동으로 이루어집니다모..

안녕하세요 오늘은 개발을 좀 더 깊이 있게 하기 위해서 브라우저의 동작 원리를 알아보려고 합니다 많이 어렵고 내용이 많을 수도 있지만 알아봅시다 !!브라우저의 구조 브라우저의 구조는 7가지로 나눌 수 있습니다브라우저 동작 원리사용자 인터 페이스(UI)브라우저에서 볼 수 있는 거의 모든 것 (주소창, 뒤로가기, 앞으로 가기, 새로고침, 북마크, 환경설정)브라우저 엔진사용자 인터페이스와 렌더링 엔진 사이에서 중재자 역할을 합니다렌더링 엔진HTML와 CSS, Javascript를 파싱하고 그 결과물로 페이지를 그려내는 역할을 합니다통신HTTP 요청과 같은 네트워크 호출 시에 실행합니다JS 엔진JavaScript 코드를 해석하고 실행합니다UI 백엔드브라우저가 동작하고 있는 운영체제의 인터페이스를 UI들을 처리합..