Skip to content

u4bi-store/feed

Repository files navigation

feed

Usage

$ git clone https://github.com/myungjaeyu/feed.git && cd feed

$ yarn install

$ yarn boot

$ yarn start

# client
# http://localhost:3000

# storybook
# http://localhost:9009

Directory Structure

feed/
│
├── package.json
│
└── packages
    │
    │
    ├── api
    │   │
    │   ├── package.json
    │   │
    │   └── src
    │       │
    │       ├── routes
    │       │   │
    │       │   └── api
    │       │       ├── feed
    │       │       │   └── index.ts
    │       │       │
    │       │       └── index.ts
    │       │
    │       └── services
    │           └── feed.ts
    │
    │
    ├── client
    │   │
    │   ├── package.json
    │   │ 
    │   └── src
    │       │
    │       ├── components
    │       │   ├── Layout.tsx
    │       │   └── Link.tsx
    │       │
    │       │
    │       ├── containers
    │       │   └── app.ts
    │       │
    │       │
    │       ├── hooks
    │       │   └── useApp.ts
    │       │
    │       │
    │       ├── models
    │       │   ├── IAppState.ts
    │       │   │
    │       │   ├── IProduct.ts
    │       │   │
    │       │   └── IRank.ts
    │       │
    │       │
    │       ├── pages
    │       │   ├── home
    │       │   │   └── index.tsx
    │       │   │
    │       │   └── ranking
    │       │       └── index.tsx
    │       │
    │       ├── router
    │       │   └── index.tsx
    │       │
    │       └── services
    │           └── feed.ts
    │
    │
    └── design-system
        │
        ├── package.json
        │ 
        └── src
            │
            ├── atoms
            │   │
            │   └── Loader
            │       │
            │       ├── Loader.stories.tsx
            │       └── Loader.tsx
            │
            │
            ├── molecules
            │   │
            │   ├── HeaderTab
            │   │   │ 
            │   │   ├── HeaderTab.stories.tsx
            │   │   └── HeaderTab.tsx
            │   │
            │   ├── HeaderTitle
            │   │   │
            │   │   ├── HeaderTitle.stories.tsx
            │   │   └── HeaderTitle.tsx
            │   │
            │   ├── Rank
            │   │   │
            │   │   ├── Rank.stories.tsx
            │   │   └── Rank.tsx
            │   │
            │   └── Tile
            │       │
            │       ├── Tile.stories.tsx
            │       └── Tile.tsx
            │
            │
            └── templates
                │
                ├── ListTemplate
                │   │
                │   ├── ListTemplate.stories.tsx
                │   └── ListTemplate.tsx
                │
                ├── PageTemplate
                │   │
                │   ├── PageTemplate.stories.tsx
                │   └── PageTemplate.tsx
                │
                └── TilesTemplate
                    │
                    ├── TilesTemplate.stories.tsx
                    └── TilesTemplate.tsx



service

A micro web service monorepo setup using lerna / Front-end toolkit

  • (Latest ver: 2/20/2020 AM 09:50)

Usage

$ git clone https://github.com/myungjaeyu/service.git && cd service

$ yarn install

$ yarn boot

$ yarn start

# client
# http://localhost:3000

# api proxy
# http://localhost:3000/api/github/myungjaeyu

# api
# http://localhost:3001/api/github/myungjaeyu

# storybook
# http://localhost:9009

$ yarn build

$ yarn serve
# http://localhost:8080
# http://localhost:8080/api/github/myungjaeyu

$ yarn serve-ui
# http://localhost:9009

$ yarn lint

Deploy in UI Storybook Dev Server

https://storybook-static-pi.now.sh

# deploy

$ yarn build

$ yarn deploy-ui

Packages

dependencies

shared

prettierrc.json

{
    "printWidth": 200,
    "semi": false,
    "singleQuote": true,
    "jsxSingleQuote": true,
    "arrowParens": "always",
    "tabWidth": 4
}

Directory Structure

service/
│
├── storybook-static/ # (design-system)
│
├── dist/ # (api, client)
│
├── packages/
│   ├── api/
│   ├── client/
│   └── design-system/
│
└── package.json

API

    express
    prerender-node

Client

    react
    react-router-dom
    react-meta-tags
    react-hook-form
    react-use

    unstated-next # state mgmt

    js-cookie
    query-string
    i18next

    @emotion/styled
    bootstrap4 # index.ejs cdn
    fontawesome5 # index.ejs cdn

    less
    postcss
    babel7

    analytics

Design-system

    react
    react-use

    classnames

    @emotion/styled
    bootstrap4 # preview-head.html cdn
    fontawesome5 # preview-head.html cdn

    # addons
    @storybook/addon-actions
    @storybook/addon-storysource
    @storybook/addon-viewport
    @storybook/addon-info

Copyright © 2020 Myungjae Yu


Docker Container

$ yarn build

$ docker-compose build && docker-compose up

# http://localhost:5000

Serverless AWS Lambda & CloudFront

$ serverless deploy

SCP

$ zip -r service.zip . && scp -i [pem key] service.zip root@127.0.0.1:~/blah/blah

License

MIT license.