Giter Club home page Giter Club logo

event-storming-tool's Introduction

service-ui

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.

k8s-UI

event-storming-tool's People

Contributors

kimsanghoon1 avatar

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

event-storming-tool's Issues

연결채널 만들기

오른쪽 하단에 Contact Us하여 Email 같은 것 연결

[수정] 오른쪽 하단에 'Consult this'를 넣어 SaaS 사용자 요청과 동시에 Provider가 개입할 수 있는 채널

event - attribute 문의

event 스티커의 attribute 수정 기능 및 attribute 순서 변경 기능이 있는지 궁금합니다
현재는 수정 및 순서 설정 방법이 없어서 지웠다가 다시 작성하고 있습니다.

[개선] 각 항목에 description 이 있었으면 좋겠음

이름으로 충분한 전달이 안될시 설명항목이 있으면,
서로 논의할때 이것이 어떤 기능인지를 알수있을듯 함

특히나 폴리시 같은 경우는 할일이 여러개 있을수도 있고, 설명하고자 하는 말이 많을것으로 보임

Github API 제한 (시간당 60번)

For API requests using Basic Authentication or OAuth, you can make up to 5000 requests per hour. Authenticated requests are associated with the authenticated user, regardless of whether Basic Authentication or an OAuth token was used. This means that all OAuth applications authorized by a user share the same quota of 5000 requests per hour when they authenticate with different tokens owned by the same user.

For unauthenticated requests, the rate limit allows for up to 60 requests per hour. Unauthenticated requests are associated with the originating IP address, and not the user making requests.

[MVP] 타이틀 로고 변경

-로고영역의 'uEngine' 텍스트를 'Eventstorming2Code' 로 변경
-Eventstorming2Code 를 형상화한 이미지 제작 후 대체
-by uengine.rog

zoom 버튼 위치

현재 오른쪽 상단에 있는데.. 자꾸 움직여야 하는 필요가 있네요 - 버튼클릭이라던가..
오른쪽이나 왼쪽 아래로 내리는게 좋아보임

[MVP] 직관적이고 일관된 Property UI/UX 적용

  • 프라퍼티 Windows 최 상위 > 선택된 오브젝트 명 기술
  • Property 설정별 카테고리 명(서브 타이틀) 입력
  • 카테고리별 세부 설정 내용들은 Indentation 후 기술
  • 모든 표기는 영문이 default

Template 엔진 사용

  1. 사용 템플릿 엔진: https://github.com/janl/mustache.js
  2. 추천 사유: Java와 Javascript 에서 동일하게 템플릿을 공유해서 사용할 수 있음. 때에 따라, 코드 전환 기능을 서버로 보내서 전환하지 말고 그냥 client 단 (vue.js javascript) 내에서 전환하면, 서버 비용도 줄이고 단순한 아키텍처를 유지할 수 있음.
  3. 템플릿 사용 예시 (자바): uengine-cloud-server/src/main/java/org/uengine/cloud/scheduler/CreateAppJob.java
            //mapping 파일들의 콘텐트를 교체한다.
            List<FileMapping> mappings = categoryItem.getMappings();

            //template 특유의 파일 목록이 있으면 파일 생성 목록에 추가해줌
            if(appCreate.getTemplateSpecific()!=null && appCreate.getTemplateSpecific().getFileMappings()!=null)
                mappings.addAll(appCreate.getTemplateSpecific().getFileMappings());

            Map<String, String> templateFileCache = new HashMap<>();

            MustacheTemplateEngine templateEngine = new MustacheTemplateEngine();
            for (FileMapping mapping : mappings) {

                Map<String, Object> templateData = data;

                String path = mapping.getPath();
                String file = mapping.getFile();

                final String body = templateEngine.executeTemplateText(file, data);
                //override if there are template data specified in each file mapping
                if(mapping.getData()!=null){
                    templateData = new HashMap<String, Object>();
                    templateData.putAll(data);
                    templateData.put("templateSpecificData", mapping.getData());

                    if(templateFileCache.containsKey(file))
                        file = templateFileCache.get(file);
                    else {
                        String templateFile = gitlabExtentApi.getRepositoryFile(categoryItem.getProjectId(), "master", "template/file/" + file);
                        templateFileCache.put(file, templateFile);
                        file = templateFile;
                    }
                }

                final String body = templateEngine.executeTemplateText(file, templateData);
                gitlabExtentApi.updateOrCraeteRepositoryFile(projectId, "master", path, body);
            }

템플릿 예시:

  • Entity.java
package hello;

import javax.persistence.*;
import java.util.List;

@Entity
@Table(name="{{templateSpecificData.name}}table")
public class {{templateSpecificData.name}} {

    {{#templateSpecificData.fieldDescriptors}}{{#attributes.isKey}}@Id @GeneratedValue(strategy=GenerationType.AUTO){{/attributes.isKey}}{{attributes.multiplicity}}
    private {{className}} {{name}};
    {{/templateSpecificData.fieldDescriptors}}

    public {{templateSpecificData.name}}() {}

    {{#templateSpecificData.fieldDescriptors}}
    public {{className}} get{{attributes.nameForSetterGetter}}() {
        return {{name}};
    }

    public void set{{attributes.nameForSetterGetter}}({{className}} {{name}}) {
        this.{{name}} = {{name}};
    }

    {{/templateSpecificData.fieldDescriptors}}
}

- Repository.java
package hello;

import org.metaworks.multitenancy.persistence.MultitenantRepository;
import org.springframework.data.repository.PagingAndSortingRepository;

public interface {{templateSpecificData.name}}Repository extends MultitenantRepository<{{templateSpecificData.name}}, {{templateSpecificData.keyFieldDescriptor.className}}> {

}

[개선] entity 를 적을시 UX 관점

이벤트나 어그리게이트에서 id 나 name 같은 세부 항목을 적을때 'ENTITY ADD' 라는 버튼을 클릭하여 추가를 하는데,
그냥 컬럼명만 적고 엔터를 치면 자동으로 넘어가면 빠르게 작업이 될듯함.
왼쪽에 int, string 같은게 선택되어있으면 그거를 쓰고, 선택안하면 자동으로 string 으로 체크되어서..

우선순위는 낮음

[MVP] Guided Tour 작성

이벤트스토밍 순서에 따른 툴 사용법 가이드
스티커 색상별 기능 및 Polyglot (e.g. Springboot) Code generation 매핑 관계 설명
Guided tour 제공방안 : 1) 메뉴얼 메뉴를 통해, 2) Welcome Page, 3) startup Tips를 통해

[개선] 코드 view 에 스크롤바 개선

코드를 보는 화면에..
왼쪽에 트리구조와, 오른쪽에 코드를 보는것이 현재는 하나의 스크롤에 묶여서 움직이는데,
이것을 따로따로 움직이면, 코드를 볼때 현재 파일명을 확인 할 수 있어서 좋을듯함

Drag & Drop for Mobile 지원

Solution
Since all mobile and tablet events are triggered by touch, we will be using Touch API to solve the Drag and Drop problem.
note:
This demo solution is targeted only on mobile devices since browsers don’t have any touch interfaces. Toggle your browser device toolbar and change device to any mobile or tablet from your browser inspect.
I’ll be using only the basic features of Touch api, such as Touch.pageX and Touch.pageY to read x and y coordinates of my touch event.

Complete code available in codepen
Lets start by creating a draggable box in our HTML code.

Next would be styling. Note, the position of box element should be absolute to its parent. #box { position: absolute; width: 100px; height: 100px; background-color: #ccc; } Now comes the magic with your Vanilla JS to make the box element draggable. window.onload = function() { // find the element that you want to drag. var box = document.getElementById('box');

/* listen to the touchmove event,
every time it fires, grab the location
of touch and assign it to box */

box.addEventListener('touchmove', function(e) {
// grab the location of touch
var touchLocation = e.targetTouches[0];

// assign box new coordinates based on the touch.
box.style.left = touchLocation.pageX + 'px';
box.style.top = touchLocation.pageY + 'px';

})

}
Finally dropping the element.
/* record the position of the touch
when released using touchend event.
This will be the drop position. */

box.addEventListener('touchend', function(e) {
// current box position.
var x = parseInt(box.style.left);
var y = parseInt(box.style.top);
})

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.