본문 바로가기

Front-End

25-08 FE News 스크랩 Ultimate Guide to Vibe Coding'Vibe Coding'은 AI 시대에 코딩하는 새로운 접근 방식을 제안하는 가이드다.이 프로젝트는 전통적인 코딩 방식에서 벗어나 AI 코딩 조수를 활용해 더 효율적이고 창의적으로 개발하는 방법을 설명한다. 가이드는 AI와 함께 코딩할 때의 마인드셋 변화, 효과적인 프롬프트 작성법, 그리고 AI 도구의 한계를 이해하는 방법 등을 포함하고 있다. 'Vibe Coding'의 핵심은 개발자가 세부 구현보다 높은 수준의 설계와 문제 해결에 집중할 수 있게 하는 것이다.https://github.com/EnzeD/vibe-coding GitHub - EnzeD/vibe-codingContribute to EnzeD/vibe-coding development by.. 더보기
데덴찌 서비스 오픈 친구들이랑 게임을 하다가 편가를 일이 생겼다.​채팅으로 가위바위보해도 되지만 무승부가 자꾸 나다보니 참 귀찮았다.​그래서 만들었다.​편가르기 서비스 "데덴찌".https://dedenjji.3jun.store데덴찌만 넣기엔 뭔가 허전해서 추가로 있으면 좋을만한 기능들을 같이 넣어보았다.메인화면팀 자동 분배제비뽑기 많관부​버그 제보 환영합니다.​사용 기종 + 버그 내용 알려주시면 감사하겠습니다 (_ _ )​ex. 아이폰 14 pro / 팀 확인하기 버튼 화면에 잘려서 안보임​(검색엔진 크롤링 되라고 블로그 글 쓴건 안비밀)​(오징어게임에 데덴찌 나와서 떡상하게 해주세요) https://dedenjji.3jun.store 더보기
[JavaScript] 등장 배경과 의의, 특징 1. JavaScript의 등장 배경1995년 웹 브라우저 강자 넷스케이프 커뮤니케이션즈사에서 브라우저용 언어 만들기로 결정96년 3월, "모카Mocha" 등장 -> 9월 "라이브스크립트LiveScript"로 이름 변경 -> 12월 "자바스크립트JavaScript"로 이름 변경 96년 8월 마이크로소프트사에서 Jscript 개발. JScript 와 JavaScript는 애매하게 호환됨 -> 크로스 브라우징 이슈 발생 컴퓨터 시스템 표준을 관리하는 비영리 표준화 기구인 ECMA 인터네셔널에 표준화 요청.97년 표준화된 자바스크립트 초판 ECMAScript 탄생.99년 ECMAScript3 (ES3) 공개09년 ECMAScript5 (ES5) 공개15년 ES6 공개이후 매년 버전업하기로 발표1.1. ECMA.. 더보기
CSS 아키텍쳐와 BEM 1. CSS 아키텍쳐1.1. CSS 아키텍쳐란?CSS를 더 체계적이고 유지보수하기 쉽게 짜는 방법을 의미함.1.2. CSS 아키텍쳐의 종류BEM (Block Element Modifier)OOCSS (Object-Oriented CSS)SMACSS (Scalable and Modular Architecture for CSS)Atomic CSSITCSS (Inverted Triangle CSS)실무에서는 BEM이 가장 많이 쓰이는데, 그 이유는 단순하고 명확해서 (클래스 이름만 봐도 구조가 눈에 보임)협업에 강해서 (여러 명이 같은 코드 작업할 때 충돌이 적음)CSS 유지보수에 좋아서 (나중에 스타일 고칠 때 어디에 영향 가는지 예측 가능)프레임워크랑 잘 어울려서 (React, Vue 같은 컴포넌트 개발할.. 더보기
리액트 개발자를 위한 서버사이드 렌더링 딥 다이브(SSR Deep Dive for React Developers) 본 게시물은 공부를 위해 아래 게시물을 손수 번역하며 작성한 게시물입니다.일부 오역, 의역이 있을 수 있습니다.https://www.developerway.com/posts/ssr-deep-dive-for-react-developers SSR Deep Dive for React DevelopersExplore step-by-step how Server-Side Rendering (SSR), pre-rendering, hydration, and Static Site Generation (SSG) work in React, their costs, performance impact, benefits, and trade-offs.www.developerway.com ※ SSR, 프리-렌더링, 하이드레이션, 그리.. 더보기
[React] 개요 들어가며필자는 리액트를 공부중인 개발자 1인으로서, 공부하며 알게된 사실을 적어두었고 틀린 내용이 있을 수 있습니다. 지적, 조언 얼마든지 감사히 받아들이겠습니다.React란?메타(전 페이스북)에서 개발한 오픈소스 자바스크립트 라이브러리이다. 여기서 프레임워크가 아닌 라이브러리라는 사실을 이해하자. 간단하게 등장 배경을 설명하면, React는 JQuery, Angular의 시대를 거쳐 다음으로 인기를 얻게 된 프론트엔드 기술로, 이후 Vue, Svelte 등 개선된 기술들이 등장하긴 했지만 React에 비해 압도적인 이점이 없어 여전히 가장 많이 사랑받고 있다. SPA(Single Page Application)를 전제로 사용되며, Dirty Checking(상태 변경 검사)와 Virtual DOM(가상.. 더보기
[Flutter] [Windows] Flutter failed to write to a file at "C:\Users\<사용자명>\StudioProjects\<프로젝트명>\.flutter-plugins". The flutter tool cannot access the file or directory. 오늘은 아주 간단하지만 골때리는 트러블슈팅을 가져왔다. 바로 제목처럼 파일 권한 문제인데, 나같은 경우 Mac에선 괜찮다가 윈도우10에서 발생했다. MacOS나 Linux 라면 바로 chmod를 할텐데, 윈도라서 그것도 못하고... 폴더/파일 속성 들어가서 권한 확인해볼수야 있겠지만 대부분 원인은 거기에 있지 않다. 진짜 원인은 윈도우 디펜더 실시간 감시 때문이다... 실시간 감시를 끄고 flutter clean 그리고 dart pub get 한 후 실행하면 잘 되는 것을 확인할 수 있다... [실시간 감시 끄는법] 설정 - Windows 보안 - 바이러스 및 위협 방지 - 바이러스 및 위협 방지 설정 (설정 관리) - 실시간 보호 (끔으로 설정) 끝~! 더보기
[Flutter] Android Studio Ladybug에서 발생한 JDK Version 오류 회사에서 새로 지급받은 데스크톱에 플러터 세팅을 마치고, (flutter doctor -v까지 이상 없었음) 기존에 작업중이던 앱을 실행했는데 다음과 같은 에러가 발생했다.Execution failed for task ':connectivity_plus:compileDebugJavaWithJavac'. Could not resolve all files for configuration ':connectivity_plus:androidJdkImage'. > Failed to transform core-for-system-modules.jar to match attributes {artifactType=_internal_android_jdk_image, org.gradle.libraryelements=jar,.. 더보기

티스토리툴바