승원님 테스트 ✔️ com.lugstay.app.dev://app.lugstay.com/spaces/13762 https://abr.ge/jxnxfi

✔️ com.lugstay.app.dev://staging.app.lugstay.com/spaces/13762 https://abr.ge/fmcbpt

✔️ Vue CLI 프로젝트 생성

vue create ‘프로젝트 명’
Please pick a preset : Default ([Vue 2] babel, eslint)
cd ‘프로젝트 명’
npm run serve

🔗 https://cli.vuejs.org/

✔️ 라우터 설치

npm i vue-router@3.5.3

+) 2022년 2월 7일부터 뷰 라우터를 npm으로 설치시 버전(@3.5.3)을 명시해줘야 Vue2와 호환됨 +) 최신 버전은 아래 깃헙에서 참고 🔗 https://github.com/vuejs/vue-router

📁src/routes/index.js

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

export default new VueRouter({
    routes: [],
});

📁main.js

import Vue from 'vue';
import App from './App.vue';
import router from './routes/index'; // 추가

Vue.config.productionTip = false;

new Vue({
  render: h => h(App),
  router, // 추가
}).$mount('#app');

📁src/routes/index.js : 코드 스플리팅, redirect, fallback, history mode 추가

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

export default new VueRouter({
  mode: 'history', // history mode
  routes: [
    {
      path: '/',
      redirect: '/login', // redirect
    },
    {
      path: '/login',
      component: () => import('@/views/LoginPage'),
    },
    {
      path: '*',
      component: () => import('@/views/NotFoundPage'), // fallback
    },
  ],
});

🔥 3항 연산자

function Expenses(props){
    const [filteredYear, setFilteredYear] = useState('2020');
    const filterChangeHandler = selectedYear => {
        setFilteredYear(selectedYear);
    };
    const filteredExpenses = props.items.filter(expense => {
        return expense.date.getFullYear().toString() === filteredYear;
    });

    return(
        <div>
            <Card className="expenses">
                <ExpenseFilter
                    selected={filteredYear}
                    onChangeFilter={filterChangeHandler}
                />
                {/* Here */}
                {filteredExpenses.length === 0 ? (
                    <p>No expenses found.</p>
                ) : (
                    filteredExpenses.map( (expense) => (
                        <ExpenseItem
                            key={expense.id}
                            title={expense.title}
                            amount={expense.amount}
                            date={expense.date}
                        />
                    ))
                )}
            </Card>
        </div>
    );
}

🔥 && 연산자

function Expenses(props){
    const [filteredYear, setFilteredYear] = useState('2020');
    const filterChangeHandler = selectedYear => {
        setFilteredYear(selectedYear);
    };
    const filteredExpenses = props.items.filter(expense => {
        return expense.date.getFullYear().toString() === filteredYear;
    });

    return(
        <div>
            <Card className="expenses">
                <ExpenseFilter
                    selected={filteredYear}
                    onChangeFilter={filterChangeHandler}
                />
                {/* Here */}
                {filteredExpenses.length === 0 && <p>No expenses found.</p>}
                {filteredExpenses.length > 0 &&
                    filteredExpenses.map( (expense) => (
                        <ExpenseItem
                            key={expense.id}
                            title={expense.title}
                            amount={expense.amount}
                            date={expense.date}
                        />
                    ))
                }
            </Card>
        </div>
    );
}

🔥 새로운 변수 생성

function Expenses(props){
    const [filteredYear, setFilteredYear] = useState('2020');
    const filterChangeHandler = selectedYear => {
        setFilteredYear(selectedYear);
    };
    const filteredExpenses = props.items.filter(expense => {
        return expense.date.getFullYear().toString() === filteredYear;
    });

    // Here
    let expensesContent = <p>No expenses found.</p>;
    if (filteredExpenses.length > 0){
        expensesContent = filteredExpenses.map( (expense) => (
            <ExpenseItem
                key={expense.id}
                title={expense.title}
                amount={expense.amount}
                date={expense.date}
            />
        ))
    }

    return(
        <div>
            <Card className="expenses">
                <ExpenseFilter
                    selected={filteredYear}
                    onChangeFilter={filterChangeHandler}
                />
                {/* Here */}
                {expensesContent}
            </Card>
        </div>
    );
}

출처: Udemy Maximilian Schwarzmüller <React 완벽 가이드 with Redux, Next.js, TypeScript> 74강

1. git add, commit으로 파일 기록하기 2. git add, commit, diff 쉽게 하는 법 3. branch 4. merge (3-way, fast-forward, squash, rebase) 5. reset (git revert, reset, restore) 6. push

5. reset (git revert, reset, restore)

파일 복구

git restore 파일명

특정 commit 시점으로 파일 복구

git restore --source 커밋아이디 파일명

staging 취소

git restore --staged 파일명

commit 취소 (여러개 가능)

git revert 커밋아이디1 커밋아이디2

최근 commit 취소

git revert HEAD

reset (모든 작업물 과거로 돌리기)

git reset --hard 커밋아이디

reset (변동사항 staging한 상태로 과거로 돌리기)

git reset --soft 커밋아이디

reset (변동사항 지우지말고 unstage)

git reset --mixed 커밋아이디

6. push

기본 명령어

git push -u 원격저장소주소 올릴로컬브랜치명

(기본 명령어가 길어서 변수문법 사용) 원격저장소주소를 origin이라는 변수에 담음

git remote add origin 원격저장소주소

짧아진 명령어

git push -u origin master

(-u : 주소를 기억해라) 더 짧아진 명령어

git push

• homebrew 설치하기

• git 설치하기
• zsh: command not found : brew 해결하기
• git 설치 전후 버전이 동일할 때 해결하기

(이 글은 mac 환경을 처음 접하는 맥린이 개발자가 개발환경을 세팅하면서 정리한 글입니다.)

mac에는 기본적으로 git이 깔려있습니다. 제 맥북의 경우 2.37.0이었고, 현재 git 홈페이지 최신 버전은 2.37.3이라 git 버전 업데이트를 해봅시다!

1. homebrew 설치하기

https://brew.sh/index_ko

링크를 타고 들어가면 정면에 보이는 코드를 새 터미널에 복붙해줍니다. (은근 시간이 걸리더라구요? 5분은 기다린 것 같아욥)

2. git 설치하기

brew install git

✋ zsh: command not found: brew 에러난 사람 손? 댓츠 미 (Homebrew가 /usr/local/... 이 아니라 /opt/homebrew/ 에 설정되어 있어서 그런거라 금방 해결할 수 있어용)

해결방법)

vi ~/.zshrc

export PATH=/opt/homebrew/bin:$PATH

ESC 클릭, :wq 입력하고 엔터 (홈 디렉토리의 .zshrc로 설정해 zsh shell이 brew command를 찾아 실행할 수 있습니당)

그리고 다시 brew install git!

3. git 설치 전후 버전이 동일한 경우

brew info git

• git version 2.37.3

  git --version

• git version 2.37.0

이건 brew가 새로운 버전을 덮어씌우지 못해서 버전이 다르게 나오는 것입니다.

echo "export PATH=/usr/local/bin:\$PATH" >> ~/.bash_profile

터미널 재실행해서 버전 확인하면 2.37.3이 잘 나옵니다!👍