[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

[WIP] cookiecutter for the boilerplate - #14

Merged
T4rk1n merged 59 commits into
masterfrom
cookie-cutter
Oct 16, 2018
Merged

[WIP] cookiecutter for the boilerplate#14
T4rk1n merged 59 commits into
masterfrom
cookie-cutter

Conversation

@T4rk1n

@T4rk1nT4rk1n commented Sep 27, 2018

Copy link
Copy Markdown
Contributor

This PR transform the repo into a cookiecutter

Try it right now with:

$ pip install cookiecutter (if not installed)
$ cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Then follow the instructions in the generated README

Closes#13, closes#12, closes#9

@nicolaskruchten

Copy link
Copy Markdown
Contributor

This is pretty cool! The readme is pretty confusing though, because it has the {{cookiecutter.project_slug}} etc in it, so if I'm just on Github reading the readme it'll seem kind of confusing?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

Maybe the readme could say under step 2 something like "the cookiecutter command will ask you some questions, including what your project "slug" is, and then it will create your project in a directory with that name, so for the rest of this README you'll need to substitute your slug wherever you see 'slug' " or something?

@nicolaskruchten

Copy link
Copy Markdown
Contributor

I also think more guidance would be good during the Q&A step... Does cookiecutter allow us to put explanatory text throughout?

full_name [Enter name]: Nicolas Kruchten
email [Enter email]: nicolas@kruchten.com
description [description]: something?
project_name [my dash component]: njk_comp
project_slug [njk_comp]:
version [0.1.0]:
component_name [njk_comp]:
publish_on_npm [True]: false
Select open_source_license:
1 - MIT license
2 - BSD license
3 - ISC license
4 - Apache Software License 2.0
5 - GNU General Public License v3
6 - Not open source
Choose from 1, 2, 3, 4, 5, 6 (1, 2, 3, 4, 5, 6) [1]: 1

I wasn't sure if "full_name" was my name? the name of the project? Email... will someone send me email? Does it add me to a mailing list? How are these things used? What's the difference between description, project name and project slug? (to be clear, I know the answers to most of these, but an average user likely will not).

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

The readme is pretty confusing though

Right, I was changing alot of things in there and just copy/pasted from one to the other, I'll make the root one more readable alone.

Finally: I know "slug" is fairly common but is kind of a gross word and a turnoff to most non-/junior-programmers I know. I would prefer "shortname" personally :)

Ahah, did not think about that, the cookiecutter example used that so I just went with it.

Does cookiecutter allow us to put explanatory text throughout?

It only allows for defaults inbetween the brackets, we could put a better description in there and verify in a hook if it's still the default explanatory text.

@T4rk1nT4rk1n changed the title cookiecutter for the boilerplate[WIP] cookiecutter for the boilerplateSep 28, 2018
@valentijnnieman

Copy link
Copy Markdown

I'm getting this error running cookiecutter git@github.com:plotly/dash-component-boilerplate.git --checkout=cookie-cutter
screen shot 2018-10-01 at 12 06 15 pm

@T4rk1n

T4rk1n commented Oct 1, 2018

Copy link
Copy Markdown
ContributorAuthor

@valentijnnieman can you try with https ?

cookiecutter https://github.com/plotly/dash-component-boilerplate.git --checkout=cookie-cutter

Answer no to install dependencies, it's broken right now it takes a long time.

@valentijnnieman

Copy link
Copy Markdown

@T4rk1n That worked, thanks :)

@T4rk1n

Copy link
Copy Markdown
ContributorAuthor

@plotly/dash I'd like to merge this soon so we can work on more features in subsequent PR's. Please review.

Here's the files I want reviewed:

  • hooks/*
  • tests/*
  • both readme.
  • {{cookiecutter.project_shortname}}/_validate_init.py
  • {{cookiecutter.extract-meta.js}} -> added docstring validation.

@@ -0,0 +1,86 @@
# {{cookiecutter.project_name}}

This project was generated by the [dash-component-boilerplate](https://github.com/plotly/dash-component-boilerplate) it contains the minimal set of code required to create your own custom Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should move this to CONTRIBUTING.md and then have README.md contain something like:

# {{cookiecutter.project_name}}
{{cookiecutter.project_name}} is a Dash component library.
Get started with:
1. Install Dash and its dependencies: https://dash.plot.ly/installation
2. Run `python usage.py`
3. Visit http://localhost:8050 in your web browser
### Contributing
See [CONTRIBUTING.md](/CONTRIBUTING.md)

Comment thread{{cookiecutter.project_shortname}}/README.md

3. Test your tarball by copying it into a new environment and installing it locally:
```
$ pip install my_dash_component-0.0.1.tar.gz

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be templated too?

Comment threadREADME.md
- publish_on_npm: Set to false to only serve locally from the package data.
- install_dependencies: Set to false to only generate the project structure.
4. The project will be generated in the folder of `project_shortname`.
5. Follow the directions in the generated README to start developing your new Dash component.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we create a little ascii-cenima recording of this process and include it here? https://asciinema.org/

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'd like to but it's not for windows, if someone wants to do it after merge and include it, I'll create an issue for it.

Comment threadREADME.md Outdated
$ cookiecutter git@github.com:plotly/dash-component-boilerplate.git
```
3. Answer the questions about the project.
- project name: Clean project name, can contains spaces and special characters.

@chriddypchriddypOct 15, 2018

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's say:

- Project name: This is the "human-readable" name of your project. For example, "Dash Core Components".
- Component library name: This is the "python library" name of your project. By default, this is generated from your "Project name" by lowercasing the name and replacing spaces * `-` with underscores. For example, for "Dash Core Components" this would be "dash_core_components".

And just in case you missed it, let's rename "Component name" to "Component library name".

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, the library name is project_shortname derived from project_name, the component_name is the name of the generated initial Component.

Comment threadREADME.md Outdated
- component name: derived from project_name, lowercase, spaces and '-' are replaced by '_', ascii only.
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

could we leave this out and just default this to 0.0.1?

Comment threadREADME.md Outdated
- author info: author_name and author_email for package.json metadata.
- description: the project description, included in package.json.
- version: The initial version.
- license: License type for the component lib.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

component library

Comment threadREADME.md
@kmader

Copy link
Copy Markdown

This looks really great!

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ImportError: No module named dash TypeError: Cannot read property 'properties' of undefined Should this be a cookiecutter?

6 participants

@T4rk1n@nicolaskruchten@valentijnnieman@bpostlethwaite@kmader@chriddyp