Git Product home page Git Product logo

featmap's Introduction

Featmap

Featmap is a user story mapping tool for product people to build, plan and communicate product backlogs.

Featmap screenshot

Introduction

Featmap is an open source user story mapping tool. It is built using React, Typescript and Go.

Purpose

Featmap was built for product people to take advantage of a technique called user story mapping. User story mapping, or just story mapping, is an effective tool to create, plan and communicate your product backlog. Story mapping was created by Jeff Patton and its primary utility is providing us with an overview of the entire product and how user goals are broken down into a series of tasks. Finally, it helps us to define valuable product slices (releases) and prioritize between them.

Features

  • Personas
  • Markdown editing
  • Discuss user stories
  • Share your user story maps with external stakeholders
  • User story annotations
  • User story estimates with roll-ups

Intended audience

Featmap is great for product managers, product owners or just about anyone who is building products. Featmap can also be used as a light weight work item management system for development teams.

Motivation

There are many user story mapping tools, however none are really focused on easy-of-use and simplicity. Featmap was built to fill that gap. We hope you will find it as useful as we found building it.

Getting started

You have two choices when it comes to using Featmap.

  1. Use our hosted service at https://www.featmap.com. This is the most simple way of using Featmap. Note that we also offer a free trial.
  2. Host it yourself by running it on you own server, without cost. Please refer to the instructions for self-hosting.

Self hosting

Featmap can be run on your own server.

Requirements

Featmap runs on top of PostgreSQL, so make sure you have it running on your system. At this step, make sure to setup the credentials and database that Featmap will use.

Download

Download the Featmap binary for your respective platform and save it somewhere on your system. If needed, make it executable on your system.

Configuration

In the directory where you placed the binary, create a file called conf.json.

Here's a sample conf.json you can use:

{
  "appSiteURL": "https://localhost:5000",
  "dbConnectionString": "postgresql://postgres:postgres@postgres:5432/postgres?sslmode=disable",
  "jwtSecret": "ChangeMeForProduction",
  "port": "5000",
  "emailFrom": "",
  "smtpServer": "",
  "smtpPort": "587",
  "smtpUser": "",
  "smtpPass": "",
  "environment": "development"
}
Setting Description
appSiteURL The url to where you will be hosting the app.
dbConnectionString The connection string to the PostgreSQL database that Featmap should connect to.
jwtSecret This setting is used to secure the cookies produced by Featmap. Generate a random string and keep it safe!
port The port that Featmap should run on.
emailFrom The email adress that should be used as sender when sending invitation and password reset mails.
smtpServer SMTP server for sending emails.
smtpPort Optional Will default to port 587 if not specified.
smtpUser SMTP server username.
smtpPass SMTP server password.
environment Optional If set to development, Featmap assumes your are not running on https and the the backend will not serve secure cookies. Remove this setting if you have set it up to run https.

Run

Execute the binary.

./featmap-1.0.0-linux-amd64
Serving on port 5000

Open a browser to http://localhost:5000 and you are ready to go!

Upgrading

Just download the latest release and swap out the executable. Remember to backup your database and the old executable.

Building from source and running with docker-compose

Clone the repository

git clone https://github.com/amborle/featmap.git

Navigate to the repository.

cd featmap

Let's copy the configuration files

cp config/.env .
cp config/conf.json .

Now let's build it.

docker-compose build

Startup the services, the app should now be available on the port you defined in you configuration files (default 5000).

docker-compose up -d

Upgrading

Remember to backup your database (/data), just in case.

Pull down the latest source

git pull

Now let's rebuild it.

docker-compose build --no-cache

And finally run it.

docker-compose up -d

License

Featmap is licensed under Business Source License 1.1. See license

featmap's People

Contributors

amborle avatar bw-hro avatar dustin-hawkins avatar miko avatar ngirard avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

featmap's Issues

Ability to filter out releases from the view

As the map is getting large, navigation becomes difficult.

A great addition would be to be able to

  • click on a "filter" button, that would open a selector
  • select the releases to keep or to filter out from the view
    Then the view would only show the desired releases and the accompanying cards.
    The goals unrelated to the displayed releases would be hidden.

Along with navigation, this would allow to generate images of selected parts of the map (#30), which would help a lot.

The "filter" button would naturally take the place of the "show closed" button, and the selector would allow to show/display closed cards.

Add an optional "short title" field to cards

When dealing with cards, we're dealing with these two potentially conflicting needs:

  • providing context to cards and generated reports using titles;
  • keeping the maps tight

The exact same problem arises in book editing, where the use of a sole "title" field for chapters cannot always balance between providing enough context and keeping the table of contents and running headers tight enough.

As with book editing, I'd welcome the addition of an optional "short title" field to cards.
The map would display the short titles when they exist, or else the title.
Both title and short title would be exported as CSV.

This would also participate in #30.

npm error while building from source and running with docker-compose

Build failed while building from source and running with docker-compose.
Logs below

Removing intermediate container 2d29cfe6bb67
---> 4522e38d4244
Step 5/12 : COPY ./webapp/package.json webapp/package.json
---> 86068e639953
Step 6/12 : RUN cd ./webapp && npm install
---> Running in ea2648237725
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/history
npm ERR! history@"^5.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer history@"^4.7.2" from [email protected]
npm ERR! node_modules/connected-react-router
npm ERR! connected-react-router@"^6.9.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2021-07-02T11_41_14_065Z-debug.log
ERROR: Service 'featmap' failed to build: The command '/bin/sh -c cd ./webapp && npm install' returned a non-zero code: 1

Visual indicator for long text which are only partly visible

Our scrum coach tipped me about this great tool for visualizing a story, thnx!

Regarding long titles: would it be possible to add a visual indicator to make clear that a title is longer than what is shown in a box. Right now some boxes seem to have strange text in them, while in reality only part of the text is shown.

Bug in setting the 'lexorank'

Hi,
Maybe it's a functionality, but anyways. Steps to reproduce:

  • try to add 6 goals or activities or features or mvps one after each other
  • 6th item will not be added because of database constraint, which is related to the rank

When i reviewed the code i've noticed that lexorank is adding ranks interestingly, it always sets mid item between minChar and maxChar, so the first rank in the branch will always be 'm', then it will follow 's', 'v', 'x' and 'y'. After that mid character will still be 'y' as it check with the highest item and then decreases one byte down.

I didn't dig deep into the whole logic, but i think it should be reconsidered or fixed.
But there is still a possibility to avoid the problem by moving 5th item before 4th item. Then 5th will become 'w' and for 6th it still will be possible to add 'y'.

Default Postgres credentials

Hi,

Just confirming, the default Postgres:

user: featmap
database name: featmap
password: featmap

Is that right? Or I configure in the conf.json?

Thanks

Blank pages after rebuilding & restarting

After doing a git pull and rebuilding Featmap, the pages returned to my browser are blank.

Here's the complete log of what was done on our server:

ssh -t root@$server
Welcome to Ubuntu 20.04 LTS (GNU/Linux 5.4.0-26-generic x86_64)

root@test:~# cd featmap/
root@test:~/featmap# git pull
remote: Enumerating objects: 39, done.
remote: Counting objects: 100% (39/39), done.
remote: Compressing objects: 100% (7/7), done.
remote: Total 26 (delta 22), reused 23 (delta 19), pack-reused 0
Unpacking objects: 100% (26/26), 3.52 KiB | 97.00 KiB/s, done.
From https://github.com/amborle/featmap
   64daab3..42fa8b9  master     -> origin/master
Updating 64daab3..42fa8b9
Fast-forward
 webapp/src/components/Board.tsx            | 262 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-------------------------------------------------------------------------
 webapp/src/pages/ProjectPage.tsx           |   3 +--
 webapp/src/store/milestones/selectors.ts   |  10 ++++++++
 webapp/src/store/subworkflows/selectors.ts |   9 +++++--
 webapp/src/store/workflows/selectors.ts    |   7 ++++-
 5 files changed, 184 insertions(+), 107 deletions(-)
root@test:~/featmap# docker-compose build
postgres uses an image, skipping
Building featmap
Step 1/12 : FROM golang:alpine
 ---> 6af5835b113c
Step 2/12 : WORKDIR /src
 ---> Using cache
 ---> 2b70a7479410
Step 3/12 : RUN apk add --update npm git
 ---> Using cache
 ---> 39df95a9bda2
Step 4/12 : RUN go get -u github.com/jteeuwen/go-bindata/...
 ---> Using cache
 ---> a5420006f2bc
Step 5/12 : COPY ./webapp/package.json webapp/package.json
 ---> Using cache
 ---> c1bc9cabcb37
Step 6/12 : RUN cd ./webapp &&     npm install
 ---> Using cache
 ---> afdc17eb8109
Step 7/12 : COPY . .
 ---> f3f9f032f25f
Step 8/12 : RUN cd ./webapp &&     npm run build
 ---> Running in 4812e4bb1754

> [email protected] build /src/webapp
> react-scripts build

Creating an optimized production build...
Removing intermediate container 4812e4bb1754
 ---> f776e5409397
Step 9/12 : RUN cd ./migrations &&     go-bindata  -pkg migrations .
 ---> Running in deb66897a586
Removing intermediate container deb66897a586
 ---> 128887772346
Step 10/12 : RUN go-bindata  -pkg tmpl -o ./tmpl/bindata.go  ./tmpl/ &&     go-bindata  -pkg webapp -o ./webapp/bindata.go  ./webapp/build/...
 ---> Running in a3bcddb9c618
Removing intermediate container a3bcddb9c618
 ---> c95d10c7ce7a
Step 11/12 : RUN go build -o /opt/featmap/featmap &&     chmod 775 /opt/featmap/featmap
 ---> Running in 62331a87fedf
go: downloading github.com/pkg/errors v0.9.1
go: downloading github.com/stripe/stripe-go v70.15.0+incompatible                                                                                                                                                                            
go: downloading github.com/go-chi/cors v1.1.1                                                                                                                                                                                                
go: downloading github.com/dgrijalva/jwt-go v3.2.0+incompatible                                                                                                                                                                              
go: downloading github.com/go-chi/jwtauth v4.0.4+incompatible                                                                                                                                                                                
go: downloading github.com/golang-migrate/migrate/v4 v4.13.0                                                                                                                                                                                 
go: downloading github.com/satori/go.uuid v1.2.0                                                                                                                                                                                             
go: downloading github.com/jmoiron/sqlx v1.2.0                                                                                                                                                                                               
go: downloading github.com/go-chi/chi v4.1.2+incompatible                                                                                                                                                                                    
go: downloading github.com/elazarl/go-bindata-assetfs v1.0.1                                                                                                                                                                                 
go: downloading github.com/go-chi/render v1.0.1                                                                                                                                                                                              
go: downloading github.com/asaskevich/govalidator v0.0.0-20200907205600-7a23bdc65eef                                                                                                                                                         
go: downloading golang.org/x/crypto v0.0.0-20201112155050-0c6587e931a9                                                                                                                                                                       
go: downloading github.com/hashicorp/go-multierror v1.1.0                                                                                                                                                                                    
go: downloading github.com/lib/pq v1.3.0                                                                                                                                                                                                     
go: downloading github.com/hashicorp/errwrap v1.0.0                                                                                                                                                                                          
Removing intermediate container 62331a87fedf
 ---> 3957c1b2739a
Step 12/12 : ENTRYPOINT cd /opt/featmap && ./featmap
 ---> Running in f9113206ba64
Removing intermediate container f9113206ba64
 ---> 4ae33002250a
Successfully built 4ae33002250a
Successfully tagged amborle/featmap:latest
root@test:~/featmap# docker-compose down     
Stopping featmap_featmap_1  ... done
Stopping featmap_postgres_1 ... done
Removing featmap_featmap_1  ... done
Removing featmap_postgres_1 ... done
Removing network featmap_default
root@test:~/featmap# docker-compose up
Creating network "featmap_default" with the default driver
Creating featmap_postgres_1 ... done
Creating featmap_featmap_1  ... done
Attaching to featmap_postgres_1, featmap_featmap_1

Now, browsing any page have Featmap return nothing, with a 200 HTTP code.

For a (long) minute, I thought the PostgreSQL database was gone, but it's still there.

Any thoughts ?
Cheers

Is it possible to host it on a custom domain?

Hey! Thank you for a great app. I'm a bit new will all this techy stuff, but I hope you can help me.

Is it possible to host featmap on a custom domain? On something like Heroku or DO?

It's kinda tough for me to figure it out without a step-by-step tutorial :c

Self hosting doesn't work out of the box

Hey guys, i tried running the self hosted version of featmap cus i used the free trial and liked it very much. But it seems that your configuration just desn't work. I managed to get it running but i did some workarounds. So far so good. I'm going to open the pull request, some versions need to be downgraded cus theres peer dependencies, dockerfile for the featmap itself needs to be changed, etc.
I'm gonna be opening a PR with the solution or providing my own framework if you guys are not maintaining this

docker-compose build fails with npm error

I am trying to build the project using the documented docker-compose method, but it fails with the following error:

Step 1/12 : FROM golang:alpine
 ---> cfae2977b751
Step 2/12 : WORKDIR /src
 ---> Using cache
 ---> c9e8ff511471
Step 3/12 : RUN apk add --update npm git
 ---> Using cache
 ---> 90272c3dd00c
Step 4/12 : RUN go get -u github.com/jteeuwen/go-bindata/...
 ---> Using cache
 ---> cbc745e0259a
Step 5/12 : COPY ./webapp/package.json webapp/package.json
 ---> Using cache
 ---> 6a4e12da9a92
Step 6/12 : RUN cd ./webapp &&     npm install
 ---> Running in 4dfc7f1722bb
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/history
npm ERR!   history@"^5.0.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer history@"^4.7.2" from [email protected]
npm ERR! node_modules/connected-react-router
npm ERR!   connected-react-router@"^6.9.1" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2021-08-13T08_47_30_097Z-debug.log
The command '/bin/sh -c cd ./webapp &&     npm install' returned a non-zero code: 1

I successfully build it by adding --force to npm install but it doesn't seems like the optimal solution.

v1/account/app returns 401 Unauthorized

Hi,

We have installed featmap on Ubuntu 16.04 and Windows10 OS both using Postgresql v12.

The system shows the login window. When user or password are wrong, a red message is shown, that's OK.

But if login is OK, the window remains at the login.

Logs at the web browser are:

On page http://localhost:8081/account/login

Request URL: http://localhost:8081/v1/users/login
Request Method: POST
Status Code: 200 OK
... (jwt token is returned)

Request URL: http://localhost:8081/v1/account/app
Request Method: GET
Status Code: 401 Unauthorized

Idea: Ability to Clone Project

Featmap I think is a gem. Simple to use and the only tool that follows story mapping technique.

Is it possible to add a feature to clone/duplicate projects?

The use case is that there are some projects that are quite like each other, with some tailored modifications for different customers. Having an ability to duplicate would be great as it would save time from starting from nothing each time.

Dockerfile and docker-compose.yml

I created a quick Dockerfile and docker-compose.yml, but could not get the build to work properly, so this reverts to downloading the release.

  1. Create a .env file and put the appropriate release version
  2. Create a ./config/conf.json file according to your README
  3. docker-compose build
  4. docker-compose up -d

should be available on port 80.

Dockerfile

ARG featmap_version=1.0.5
RUN mkdir -p /opt/featmap && \
    echo "Fetching https://github.com/amborle/featmap/releases/download/v${featmap_version}/featmap-${featmap_version}-linux-amd64" && \
    wget -O /opt/featmap/featmap https://github.com/amborle/featmap/releases/download/v${featmap_version}/featmap-${featmap_version}-linux-amd64 && \
    chmod 775 /opt/featmap/featmap
ENTRYPOINT cd /opt/featmap && ./featmap

docker-compose.yml

version: "3"
services:
        postgres:
                container_name: pgsql-lc
                image: postgres:11-alpine
                restart: always
                environment:
                        POSTGRES_USER: featmap
                        POSTGRES_DB: featmap
                        POSTGRES_PASSWORD: password
        featmap:
                container_name: featmap
                image: amborle/featmap:v${FEATMAP_VERSION}
                restart: always
                build: 
                        context: .
                        dockerfile: Dockerfile
                        args:
                                - featmap_version=${FEATMAP_VERSION}
                depends_on: 
                        - postgres
                ports:
                        - 80:80
                volumes:
                        - ${PWD}/config/conf.json:/opt/featmap/conf.json

.env

FEATMAP_VERSION=1.0.5

Docker build is failing

Docker build is failing with below error. Please advise.

docker-compose build --no-cache
/snap/docker/2746/lib/python3.6/site-packages/paramiko/transport.py:32: CryptographyDeprecationWarning: Python 3.6 is no longer supported by the Python core team. Therefore, support for it is deprecated in cryptography. The next release of cryptography (40.0) will be the last to support Python 3.6.
  from cryptography.hazmat.backends import default_backend
postgres uses an image, skipping
Building featmap
Sending build context to Docker daemon  17.34MB
Step 1/12 : FROM golang:alpine
 ---> 818ca3531f99
Step 2/12 : WORKDIR /src
 ---> Running in 64cd69627542
Removing intermediate container 64cd69627542
 ---> 55ad42cbba9c
Step 3/12 : RUN apk add --update npm git
 ---> Running in 37007ce6499f
fetch https://dl-cdn.alpinelinux.org/alpine/v3.17/main/x86_64/APKINDEX.tar.gz
fetch https://dl-cdn.alpinelinux.org/alpine/v3.17/community/x86_64/APKINDEX.tar.gz
(1/14) Installing brotli-libs (1.0.9-r9)
(2/14) Installing nghttp2-libs (1.51.0-r0)
(3/14) Installing libcurl (7.88.1-r1)
(4/14) Installing libexpat (2.5.0-r0)
(5/14) Installing pcre2 (10.42-r0)
(6/14) Installing git (2.38.4-r1)
(7/14) Installing c-ares (1.18.1-r1)
(8/14) Installing libgcc (12.2.1_git20220924-r4)
(9/14) Installing icu-data-en (72.1-r1)
Executing icu-data-en-72.1-r1.post-install
*
* If you need ICU with non-English locales and legacy charset support, install
* package icu-data-full.
*
(10/14) Installing libstdc++ (12.2.1_git20220924-r4)
(11/14) Installing icu-libs (72.1-r1)
(12/14) Installing libuv (1.44.2-r0)
(13/14) Installing nodejs-current (19.7.0-r0)
(14/14) Installing npm (9.1.2-r0)
Executing busybox-1.35.0-r29.trigger
OK: 81 MiB in 30 packages
Removing intermediate container 37007ce6499f
 ---> 3ff770b510eb
Step 4/12 : RUN go get -u github.com/jteeuwen/go-bindata/...
 ---> Running in 90f4ce4cde79
go: go.mod file not found in current directory or any parent directory.
	'go get' is no longer supported outside a module.
	To build and install a command, use 'go install' with a version,
	like 'go install example.com/cmd@latest'
	For more information, see https://golang.org/doc/go-get-install-deprecation
	or run 'go help get' or 'go help install'.
The command '/bin/sh -c go get -u github.com/jteeuwen/go-bindata/...' returned a non-zero code: 1
ERROR: Service 'featmap' failed to build : Build failed

Idea: freeze goals and activities while scrolling

Hi!

When you have a big feature map it is difficult to place features in the good column, you have to scroll up and down, or create the feature and then drag and drop it. It would be nice if the first part (personas, goals, activities) could be 'frozen' so that the scroll only affects the tons of features below.

Hope you find this worth it!

Cannot compile go-bindata

Hi,

I'm new to Go and I installed it to my Mac using brew.

Then I did what the go-bindata archived git said:

go get -u github.com/jteeuwen/go-bindata/

But then I don't know which of the go files in the directory to do

go install [which file??]

I cannot compile feat map without that binary.

Big usability issue with "close card" button

Hey Jens,

first of all, I wish to express my gratitude for your efforts into this great open source software !
It has proved very useful in my current project, and I'm commited to promote it within my circle.

Also, I've started looking at the source code ; no promises because I'm more of a rustacean, but I may come up with a few pull requests.

Now, the biggest problem we've experienced, hands down, is related to the "Close card" button which appears at the bottom right of the card editor.

Because of its position and the prominence of its icon, we have been constantly clicking on it by mistake whereas our intention was to simply validate the changes and close the editor.

As a result, all the cards associated to a "falsely closed" one disappear from the view, since the default behaviour is to hide the closed cards, making the mistake very difficult to detect and prevent. Unfortunately, and despite our precautions, this is what happened to us: one activity was closed by mistake, and a bunch of associated feature cards went out of our attention.

Even worse, the feature cards associated to a closed activity card still appear in the exported CSV file with an OPEN status, which is questionable in itself -- I have to think about it and might file a new issue for that. Since we use the CSV file to generate our metrics and estimates for the project, this eventually lead to an embarrassing situation where we delivered erroneous data.

So I cannot but stress on the necessity for improving the user experience related to card editing. I'd suggest, at least

  • adding a second button for closing the editor next to the existing one
  • changing the icon of the "close card" button

I can ask my coworker for more specific suggestions if you wish, since he's likely to be more insightful with UX-related issues.

Cheers !

Make it easier to generate an image from a map

I'm aware that the title I'm giving to this report doesn't make it much actionable ; but I'm intending to create more specific reports and associate them to this one.

By "generate an image", I mean any way of producing an image from the canvas of a story map, so this artifact can be used to communicate better about a product and the state of affairs about it.

This is an important need to me, so I dedicated some time to it, faced difficulties, and saw room for improvements ; so perhaps I should first describe the steps I took to achieve the results I needed.

  1. Using Firefox, I visit the story map from which I want an image.

  2. I wish to print the whole as a pdf, but the default CSS isn't optimized for printing, so as step 2 I apply some specific CSS rules to the page with the help of the developer tools. More on these rules below.

  3. I can now hit Ctrl + p, and choose the following settings:

    • print to pdf;
    • set orientation to landscape
    • set the scale to some value by trial & error (the appropriate value depends on the size of the map)
    • choose margins: none

    which produces a pdf file, say Featmap.pdf

  4. Now, the pdf file needs to be converted to png, with the right resolution.

  5. Then the image must be trimmed to cut out the white space surrounding the map

  6. Finally, the resulting file needs to be given a proper name, containing the workspace name and a timestamp.

As you can see, this is far from straightforward -- and I haven't even detailed the steps 2 and 4-6.

I'm personally satisfied with the results I obtained, and I could very well live with this process as it is ; but I think that Featmap would be more valuable if it offered a easier way of generating images from maps.

So, considering the steps I outlined, I can see some room for improvements:

Step 2 would be made easier by allowing to specify a custom stylesheet to a project or to a workspace. This would be useful for other purposes as well, so I'm about to create an issue about it.

Step 3 would be made easier by generating the pdf with the appropriate settings on the server, and then sending the resulting file to the user. I don't know if you'd consider this to be out of scope, so I won't open an issue for it.

In the same way, steps 4-6 could also be performed automatically on the server. For reference, here's the command I use which achieves all 3 steps at once (leveraging convert from ImageMagick):

convert -density 600 -bordercolor white -border 1x1 -trim +repage Featmap.pdf "${workspace_name}"_$(date --iso-8601=minutes | tr -d ':' | sed 's|\+.*$||').png

In any case, the README could gain a section containing guidance on how to produce images, so I think I'll open an issue for that.

Now, I'll hereafter paste the set of rules that allowed me to achieve with better results, and comment on them.
I initially thought I'd submit a pull request, but as you'll see it raises a number of questions.

@media print {
    /* 1. Header */
    header { display: none; }

    /* 2. Very narrow font */
    body { font-family: Axel}
    
    /* 3. Enable hyphenation */
    .flex * {
        hyphens: auto;
        word-wrap: break-word;
        word-break: break-word;
    }

    /* 4. Remove the empty card slots */
    .flex.p-1.w-32.h-16.border.border-dashed.border-gray-200.rounded.items-center.justify-center {
        display: none;
    }

    /* 5. Remove the "Add Persona" buttons */
    button.flex.text-sm.p-1.rounded.font-semibold {
        display: none;
    }
    
    /* 6. Remove the "Add release" slot */
    .flex.p-2.text-xs {
        display: none;
    }
    
    /* 7. Remove the title + buttons */
    .flex.flex-row.p-2 {
        display: none;
    }
    
    /* 8. Make the cards narrower and taller */
    .w-32 {
        width: 5.5rem; /* 8rem */
    }
    .h-16 {
        height: 7rem; /* 4rem */
    }

}

As you can see, there are all constrained by a @media print selector, which leaves the normal output untouched.
You might want to add such selector to Featmap's CSS, and choose to adopt some of the rules I came up with.

Rule 1 is questionable, because it removes the title of the map from the output. I chose to do so because my main map is very large so I'm missing vertical real estate, but ideally (in an hypothetical future version of Featmap) the choice would be offered to the user.

Rule 2 did help, but the Axel font is licensed, so some narrow font would need to be found within the free fonts.

Rules 3 enable hyphenation, which helped a lot. I'd even suggest enabling it all the time, so I think I'll open an issue for that.

Now, with rules 4 to 8, I ran into a problem with Featmap's CSS.
Let's take rule 4 as an example.
What I want as a user, is to override the appearance of the empty card slots. This would usually be possible by finding the relevant semantic CSS class, then adding new rules to that class.
Unfortunately, there are no semantic CSS classes in the code, there are only utility classes from the TailWind framework.
I'm hereby not criticizing the choice of TailWind nor I'm critisizing the use of utility classes. I'm convinced they were beneficial to you, as an application developer.
What I think are missing is a set of semantic classes that would allow user-level customization. Even empty classes would suffice.
I thus intend to create an issue for this, probably tomorrow.

Stuck with an inactive workspace

Hello there,
thanks for this great app. I'd love to support its developpement if possible.

Meanwhile, I'm self-hosting it and recently I stumbled upon a blocking issue. Here's what I see on the second workspace I created:

Capture d’écran 2023-06-14 à 10 08 27

I click on "here" but I don't see anything I can do to have it active again. It used to work smoothly but now I can't edit these projets so I'm stuck :/

This tool is the best I've ever found to work on featmaps. I'd really appreciate if anyone had an idea to help on this 🙏

smtp error: x509: certificate signed by unknown authority

My server uses self-signed certs, and Let's Encrypt signed certs. Both should be valid in this case. Any work around/configuration/fix to make it work?

2022/06/28 18:28:04 smtp error: x509: certificate signed by unknown authority
2022/06/28 18:28:04 error sending mail

Collapsing columns

Would it be possible to implement collapsing of columns (for Goals), in a silimar way to the closed milestones, or to collapsing columns in other kanban tables (gitlab, wrike etc) ?

For projects with many goals (columns) the navigation becomes harder, and you do not always want to see all the goals (and their features).

Issues running docker composer build

Hello there, Featmap authors!

Hope this message finds you well. Congratulations on creating this tool and making it available.
If I may ask, I'm going through some issues I'm not being able to resolve myself, thus I'd like to see if you can provide some guidance.

I found 3 issues so far, 1 of which I think I solved. These are:

1. go-bindata

 => ERROR [ 4/11] RUN go get -u github.com/jteeuwen/go-bindata/...                                  0.5s
------                                                                                                   
 > [ 4/11] RUN go get -u github.com/jteeuwen/go-bindata/...:                                             
#0 0.303 go: go.mod file not found in current directory or any parent directory.                         
#0 0.303        'go get' is no longer supported outside a module.                                        
#0 0.303        To build and install a command, use 'go install' with a version,                         
#0 0.303        like 'go install example.com/cmd@latest'                                                 
#0 0.303 	For more information, see https://golang.org/doc/go-get-install-deprecation
#0 0.303 	or run 'go help get' or 'go help install'.

This one I fixed by replacing the command, and making it use 'go install' instead.

2. Next, I got a dependency issue with the history module:

=> ERROR [ 6/11] RUN cd ./webapp &&     npm install                                                8.8s
------                                                                                                   
> [ 6/11] RUN cd ./webapp &&     npm install:
#0 8.775 npm ERR! code ERESOLVE
#0 8.779 npm ERR! ERESOLVE unable to resolve dependency tree
#0 8.779 npm ERR! 
#0 8.779 npm ERR! While resolving: [email protected]
#0 8.780 npm ERR! Found: [email protected]
#0 8.780 npm ERR! node_modules/history
#0 8.780 npm ERR!   history@"^5.0.0" from the root project
#0 8.780 npm ERR! 
#0 8.780 npm ERR! Could not resolve dependency:
#0 8.780 npm ERR! peer history@"^4.7.2" from [email protected]
#0 8.780 npm ERR! node_modules/connected-react-router
#0 8.780 npm ERR!   connected-react-router@"^6.9.1" from the root project
#0 8.780 npm ERR! 
#0 8.780 npm ERR! Fix the upstream dependency conflict, or retry
#0 8.781 npm ERR! this command with --force or --legacy-peer-deps
#0 8.781 npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
#0 8.781 npm ERR! 
#0 8.781 npm ERR! 
#0 8.781 npm ERR! For a full report see:
#0 8.781 npm ERR! /root/.npm/_logs/2023-04-07T01_54_26_710Z-eresolve-report.txt
#0 8.784 
#0 8.784 npm ERR! A complete log of this run can be found in:
#0 8.784 npm ERR!     /root/.npm/_logs/2023-04-07T01_54_26_710Z-debug-0.log

Couldn't manage to resolve it properly, but in an attempt to move forward, used the --force parameter as suggested

3. Then, got to this SSL related issue, which may have something to do with Node version being used in build process

=> ERROR [ 8/11] RUN cd ./webapp &&     npm run build                                              6.5s 
------                                                                                                   
 > [ 8/11] RUN cd ./webapp &&     npm run build:                                                         
#0 0.968                                                                                                 
#0 0.968 > [email protected] build                                                                    
#0 0.968 > react-scripts build                                                                           
#0 0.968                                                                                                 
#0 4.120 Creating an optimized production build...
#0 5.626 Error: error:0308010C:digital envelope routines::unsupported
#0 5.626     at new Hash (node:internal/crypto/hash:71:19)
#0 5.626     at Object.createHash (node:crypto:140:10)
#0 5.626     at module.exports (/src/webapp/node_modules/webpack/lib/util/createHash.js:135:53)
#0 5.626     at NormalModule._initBuildHash (/src/webapp/node_modules/webpack/lib/NormalModule.js:417:16)
#0 5.626     at handleParseError (/src/webapp/node_modules/webpack/lib/NormalModule.js:471:10)
#0 5.626     at /src/webapp/node_modules/webpack/lib/NormalModule.js:503:5
#0 5.626     at /src/webapp/node_modules/webpack/lib/NormalModule.js:358:12
#0 5.626     at /src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:373:3
#0 5.626     at iterateNormalLoaders (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:214:10)
#0 5.626     at iterateNormalLoaders (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:221:10)
#0 5.626     at /src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:236:3
#0 5.626     at runSyncOrAsync (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
#0 5.626     at iterateNormalLoaders (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:232:2)
#0 5.626     at Array.<anonymous> (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:205:4)
#0 5.626     at Storage.finished (/src/webapp/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:55:16)
#0 5.626     at /src/webapp/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:91:9
#0 5.672 /src/webapp/node_modules/react-scripts/scripts/build.js:19
#0 5.672   throw err;
#0 5.672   ^
#0 5.672 
#0 5.672 Error: error:0308010C:digital envelope routines::unsupported
#0 5.672     at new Hash (node:internal/crypto/hash:71:19)
#0 5.672     at Object.createHash (node:crypto:140:10)
#0 5.672     at module.exports (/src/webapp/node_modules/webpack/lib/util/createHash.js:135:53)
#0 5.672     at NormalModule._initBuildHash (/src/webapp/node_modules/webpack/lib/NormalModule.js:417:16)
#0 5.672     at /src/webapp/node_modules/webpack/lib/NormalModule.js:452:10
#0 5.672     at /src/webapp/node_modules/webpack/lib/NormalModule.js:323:13
#0 5.672     at /src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:367:11
#0 5.672     at /src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:233:18
#0 5.672     at context.callback (/src/webapp/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
#0 5.672     at /src/webapp/node_modules/babel-loader/lib/index.js:59:103 {
#0 5.672   opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
#0 5.672   library: 'digital envelope routines',
#0 5.672   reason: 'unsupported',
#0 5.672   code: 'ERR_OSSL_EVP_UNSUPPORTED'
#0 5.672 }
#0 5.672 
#0 5.672 Node.js v19.7.0

This one I really didn't manage to overcome.

Can you please have a look at these and provide some help?

Much appreciated.

KR,

David

Originally posted by @davidlindgren in #77

Production environment give 401 error

Hi,

I compiled, configured the database and now when I run the app, after creating the account, I cannot login. I keep seeing:

 2019/08/23 10:55:41 [Chims-MacBook-Pro.local/e5ws1k8oOj-000070] "GET http://localhost/v1/account/app HTTP/1.1" from [::1]:54069 - 401 13B in 332.253µs

The app keep rejecting my credentials and I tried resetting and even changing the values directly in the database. Then I changed the environment from production to development and it worked.

NPM ERROR: WHEN I AM TRYING TO INSTALL

Hi

When I run docker-compose build, it show me the following error message:

sh: react-scripts: not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! [email protected] build: react-scripts build
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2021-02-22T09_23_20_011Z-debug.log
ERROR: Service 'featmap' failed to build : The command '/bin/sh -c cd ./webapp && npm run build' returned a non-zero code: 1

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.