https://github.com/clzzi/clzzi-sleact_zerocho

📢 Sleact [Slack Clone Coding with ZeroCho]
https://github.com/clzzi/clzzi-sleact_zerocho

emotion react slack swr ts

Last synced: 26 days ago
JSON representation

📢 Sleact [Slack Clone Coding with ZeroCho]

• Host: GitHub
• URL: https://github.com/clzzi/clzzi-sleact_zerocho
• Owner: Clzzi
• Created: 2021-08-10T09:51:17.000Z (almost 5 years ago)
• Default Branch: main
• Last Pushed: 2021-08-13T03:21:11.000Z (almost 5 years ago)
• Last Synced: 2025-03-17T11:50:41.955Z (about 1 year ago)
• Topics: emotion, react, slack, swr, ts
• Language: TypeScript
• Homepage:
• Size: 1.12 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
## 📢 Sleact [Slack Clone Coding With ZeroCho]

인프런 강의인 [](https://www.inflearn.com/course/%ED%81%B4%EB%A1%A0%EC%BD%94%EB%94%A9-%EC%8B%A4%EC%8B%9C%EA%B0%84%EC%B1%84%ED%8C%85/dashboard)을 보고 배운점 및 소스코드를 올렸습니다.

### [느낀점 및 배운점 바로가기](https://github.com/Clzzi/Clzzi-Sleact_ZeroCho/blob/main/Realization.md)

  프로젝트 결과물

  

  - **로그인 / 회원가입**

  


    

    

  

  

  - **메인화면**

  


    

  

  

  - **Channel**: 그룹채팅

  


    

  

  

  - **Direct Message**: 개인채팅

  


    

  
  

  

  - **각종 메뉴**: Profile, Workspace

  


    

    

  

  

  - **각종 모달**: Workspace, Invite

  


    

    

  

  

  - **그 외**: Image, onLine, unRead

  


    

    

    

  

  


### 사용기술

- **```React```** : Framework

- **```TypeScript```**: Language

- **```SWR```**: State Management

- **```Emotion```**: Styling Lib

  package.json

  

  ```

    "dependencies": {

        "@emotion/babel-plugin": "^11.3.0",

        "@emotion/react": "^11.4.1",

        "@emotion/styled": "^11.3.0",

        "@loadable/component": "^5.15.0",

        "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",

        "@types/autosize": "^4.0.0",

        "@types/gravatar": "^1.8.3",

        "@types/react": "^17.0.16",

        "@types/react-dom": "^17.0.9",

        "autosize": "^5.0.1",

        "axios": "^0.21.1",

        "cross-env": "^7.0.3",

        "css-loader": "^6.2.0",

        "gravatar": "^1.8.1",

        "react": "^17.0.2",

        "react-dom": "^17.0.2",

        "react-router": "^5.2.0",

        "react-router-dom": "^5.2.0",

        "react-toastify": "^7.0.4",

        "socket.io-client": "^2.4.0",

        "style-loader": "^3.2.1",

        "swr": "^0.5.6",

        "ts-node": "^10.2.0",

        "typescript": "^4.3.5"

      },

      "devDependencies": {

        "@babel/core": "^7.15.0",

        "@babel/preset-env": "^7.15.0",

        "@babel/preset-react": "^7.14.5",

        "@babel/preset-typescript": "^7.15.0",

        "@jjordy/swr-devtools": "^1.0.6",

        "@types/loadable__component": "^5.13.4",

        "@types/node": "^16.4.13",

        "@types/react-custom-scrollbars": "^4.0.8",

        "@types/react-mentions": "^4.1.3",

        "@types/react-router": "^5.1.16",

        "@types/react-router-dom": "^5.1.8",

        "@types/socket.io-client": "^1.4.35",

        "@types/webpack": "^5.28.0",

        "@types/webpack-bundle-analyzer": "^4.4.1",

        "@types/webpack-dev-server": "^3.11.5",

        "babel-loader": "^8.2.2",

        "dayjs": "^1.10.6",

        "eslint": "^7.32.0",

        "eslint-config-prettier": "^8.3.0",

        "eslint-config-react-app": "^6.0.0",

        "eslint-plugin-flowtype": "^5.9.0",

        "eslint-plugin-import": "^2.24.0",

        "eslint-plugin-jsx-a11y": "^6.4.1",

        "eslint-plugin-prettier": "^3.4.0",

        "eslint-plugin-react": "^7.24.0",

        "fork-ts-checker-webpack-plugin": "^6.3.2",

        "prettier": "^2.3.2",

        "react-custom-scrollbars": "^4.2.1",

        "react-mentions": "^4.3.0",

        "react-refresh": "^0.10.0",

        "regexify-string": "^1.0.16",

        "webpack": "^5.49.0",

        "webpack-bundle-analyzer": "^4.4.2",

        "webpack-cli": "^4.7.2",

        "webpack-dev-server": "^3.11.2"

      }

  ```