본문 바로가기

IT_Developers/IDE145

Atom - 에디터 편집기에 세로 실선 없애기 / 줄 바꿈 선 없애기 editor 가운데 있는 선 없애기 안녕하세요.고코더 입니다. ● 1. 아톰 편집기에서 세로 가늘한 선 워드랩이라고 불리는 이것은 줄바꿈 라인을 알려주는 선입니다.워드랩이라고도 하는데요. 보통은 이 라인을 사용하지 않는데 실선을 바라보면서 개발하는 경우가 많습니다.이걸 없애보겠습니다. ● 2. file(파일) -> Stylesheet(스타일시트)를 클릭 합니다. ● 3. 그리고 나타나는 창에서 해당 CSS를 붙혀넣고 세이브 합니다. atom-text-editor::shadow {.wrap-guide { visibility: hidden;} ● 4. 그럼 즉시 세로 선이 없어집니다. 눈에 거슬리는 세로 선부터 없애고 시작하세요 마무리 저 선이 해당 소스에 줄 바꿈 기준이 되는 세로 선입니다. 2019. 10. 4.
아톰 - Atom 테마 변경 / theme Atom theme 바꾸기 안녕하세요.고코더 입니다. ● 1. 아톰 설치를 함께 따라 해보셨습니다.->아톰 - atom 텍스트 에디터 설치 / 첨부파일 ● 2. 이번에는 테마를 변경하여 내눈이 편한 개발 환경을 만들어 보려고 합니다. 예민하지 않아 아무거나 잘쓴다고생각하는 분들도 테마를 내 눈에 맞게 변경하면 피로감이 덜하다는 걸 알 수 있습니다. 변경해보세요. ● 3. File -> Settings 로 이동 합니다. ● 4. 그리고 Theme 탭에서 UI Theme - 개발도구를 이루는 겉 색상Syntax Theme - 개발시에 폰트의 글자 색상이 두가지를 지정 가능합니다. ● 5. 저는 좀 더 어두운 Atom Dark로 변경 했습니다. 좀 더 고급스럽고 눈에 피로가 덜합니다. 아톰에 테마를 내눈에 맞.. 2019. 10. 3.
아톰 - Atom 텍스트 에디터 설치 / 첨부파일 무료 개발도구 최강자 아톰을 설치해보자 안녕하세요.고코더 입니다. ● 1. 개발툴의 최강자 깃허브에서 만든 아톰을 설치해보는 시간을 가지려 합니다.개인적으로 젯브레인 스톰 계열을 쓰기 때문에 아톰은 잘 안쓰는데요.무료 프로그램에 대한 요구사항이 아톰을 설치 해보려고 합니다. ● 2. 해당 홈페이지에 접속합니다. 다운로드 버튼을 확인 할 수 있습니다.-> https://atom.io/ ● 3. 해당 파일을 첨부파일에도 올려두겠습니다. ● 4. 설치를 시작하면 깃허브 감성이 느껴집니다. 깃허브 개발자들은 예술을 좋아하는거 같네요.그런데 이 화면이 다입니다. 애니메이션을 보고 있으면 그냥 알아서 모든걸 설치합니다. ● 5. 그리고 아톰이 자동 실행 되었습니다. 가볍고 무료이고 감각적이고 어느거 하나 깔게 없는.. 2019. 10. 3.
intellij - 설치방법 / 포터블 설치 / PhpStorm,WebStorm 웹스톰 포터블로 설치하기 안녕하세요. 고코더 입니다. ● 1. 인텔리제이 개발툴을 설치를 하는 방법을 배워보겠습니다. Webstorm 기준으로 설치를 함께 진행 해보겠습니다. 해당 사이트에 접속하여서 다운로드를 받습니다. http://bit.ly/2YohpZD ● 2. 그리고 저처럼 안정화된 이전버전을 받고 싶은분은 해당 버튼을 누르거나 URL로 이동합니다. http://bit.ly/2SL89cs ● 3. 버전은 2017년로 다운로드 받아보겠습니다. 제 블로그 강의에서 웹스톰을 사용하는 경우 이버전을 사용중입니다. ● 4. 첨부파일을 다운 받으셔도 됩니다. ● 5. 설치는 당연히 설치파일을 누르면 ● 6. 설치과정이 완료 됩니다. ● 7. 하지만 개인적으로 포터블 버전으로 설치하여 사용하는걸 추천드리는데.. 2019. 7. 29.
intellij - 인텔리제이 외부 테마 적용하기 / PhpStorm,WebStorm theme 파일 적용하기 안녕하세요. 고코더 입니다. 오늘은 인텔리제이 프로그램에서 외부에서 다운받은 테마 파일을 적용하는 방법을 알아보겠습니다. ● 1. 이전 시간에 테마를 모아둔 사이트를 소개했습니다. -> intellij - 인텔리제이 에디터 테마 다운로드 사이트 / color-themes.com 거기서 가장 다운로드 횟수가 많은 Ladies Night2를 적용해보겠습니다. ● 2. 파일을 다운받습니다. 자바로 만든 티가 나는 jar 파일입니다. ● 3. 그리고 인텔리 제품을 킵니다. 저는 PHP스톰에서 적용해보겠습니다. File->Import Settings 를 클릭 합니다. ● 4. 그리고 jar로 된 파일을 선택하여 OK를 누릅니다. ● 5. 그리고 적용 여부를 묻습니다. 모두 선택하고 OK .. 2019. 7. 25.
intellij - 기본 테마 변경하기 / 다크테마(Darcula) / PhpStorm,WebStorm등 드라큘라 테마로 변경 안녕하세요. 고코더 입니다. ● 1.우리나라에서 흔히 드라큘라 다크테마라고 불리는 것들이 서양에서는 드라큘라 테마라고 많이 합니다. (빛을 싫어한다나) ● 2. 그래서 이클립스도 그렇지만 -> 이클립스 기본 다크 테마 설정 인텔리제이도 어두운 빛이 적은 드라큘라 테마를 사용할 수 있습니다. ● 3. 인텔리 프로그램들은 기본테마는 조금 촌스럽습니다. ● 4. Settings에 들어가서 Appearance를 찾습니다. 그리고 여기서 theme 를 선택할 수 있습니다. ● 5. 제가 사용하는 2017 버전은 3가지 버전이 있는데요 드라큘라 버전을 선택하고 OK를 눌러보겠습니다. ● 6. 그럼 어둡고 빛이 적은 드라큘라 테마가 생성했습니다. 기본테마라 어두운 테마가 필요한분은 이 테마로 사.. 2019. 7. 25.
Phpstorm, Webstorm - 코드 미니맵 설치 / codeglance 코드 미리보기 설치 안녕하세요. 고코더 입니다. jetbrain 제품에 기본 설정이 아쉬운것중에 하나가 코드 미니맵을 제공하지 않는 것 입니다. 그래서 확장프로그램으로 codeglance를 설치하면 되는데 이상하게 플러그인에서 검색하면 해당 확장프로그램 나오질 않습니다. 그래서 홈페이지에서 제공하는 jar 파일을 다운받아 설치해야 합니다. ▼해당 URL에서 최신버전 코드글랜스를 다운로드 해주세요. https://plugins.jetbrains.com/plugin/7275-codeglance ▼그리고 setiings->plugins로 접근합니다 (ctrl+alt+s 를 눌러 plugins를 검색하세요) 그리고 install plugin from disk를 클릭 합니다. ▼ 다운받은 파일을 선택합니다. ▼ .. 2019. 4. 2.
PhpStorm ,WebStrom - 현재 소스 파일 위치 탐색기로 열기 php web스톰에서 수정중이던 파일 위치 찾기 안녕하세요. 고코더 입니다. phpstorm 으로 개발시에 FTP로 파일을 올릴려고 할때 현재 수정하던 소스를 한번에 탐색기로 열어야 할 때가 있습니다. 자주 있습니다. 그런데 단축키를 몰라서 매번 탐색기에서 찾고 있던 개발자분이 있네요 그래서 단축키 팁을 가르켜 드릴려고 합니다. ▼현재 수정하던 소스에서 ALT+F1 을 누릅니다. 그럼 이렇게 select in 창이 뜨고 숫자 8을 누릅니다. ▼그럼 이렇게 탐색기가 뜨고 해당 파일이 선택 되어 있습니다. 간단한 팁이지만 이 팁 하나로 많은 시간이 단축 됩니다. 평소에 개발툴에 많은 기능들을 알아두세요 작업속도가 향상 됩니다.! 마무리 8을 두번 누르면 소스에서 8이 남아요. 조심 2019. 3. 14.
PHPstorm, Webstorm - 에디터 글자 색 바꾸기 PHP스톰 에디터 색상 변경 안녕하세요 고코더 입니다. PHPSTORM을 사용하다보면 글자색을 바꾸고 싶을때가 있습니다. 저는 개인적으로 비주얼 스튜디오 다크테마의 색을 좋아합니다. 그래서 새로운 IDE를 사용할때 사용했던 다크테마의 색을 따라해서 글자색을 바꿔 놓습니다. 당연히 PHP스톰에도 이러한 에디터 컬러를 바꿀수 있는 기능이 있습니다. 오늘은 한번 이 설정을 알아보겠습니다. 설정으로 향하는 단축키를 누릅니다. ++ CTRL + ALT + S 그리고 Editor -> Color Scheme 에서 변경하고 싶은 언어를 클릭 합니다. 그리고 Foreground에서 컬러를 클릭해 빨간색으로 바꿔 봤습니다. 변수 색깔이 빨간색이니 눈이 아프네요 PHP스톰은 이렇게 예시로된 코드를 마우스로 눌러서 색깔을 .. 2019. 3. 6.