Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Getting Started for Devs #1362

Merged
merged 17 commits into from
Dec 7, 2021
Merged

Conversation

thisisdano
Copy link
Member

@thisisdano thisisdano commented Dec 6, 2021

Replaces #1318 and #1360

Preview

@thisisdano thisisdano marked this pull request as ready for review December 6, 2021 16:03
- href: /documentation/settings/
- href: /maturity-model/
Copy link
Member Author

Choose a reason for hiding this comment

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

Moves Maturity Model down in the side nav

@@ -91,6 +91,7 @@ How to use USWDS:
- href: /documentation/implementations/
- href: /documentation/showcase/
- href: /documentation/sample-contract-language/
- href: /website-standards/
Copy link
Member Author

Choose a reason for hiding this comment

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

Moves Website Standards down in the side nav

Comment on lines +78 to +81
- text: Getting started for developers
href: /documentation/getting-started-for-developers/
- text: Getting started for designers
href: /documentation/getting-started-for-designers/
Copy link
Member Author

Choose a reason for hiding this comment

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

These replace the old "For developers" and "For designers" sections

- text: Getting started for developers
href: /documentation/getting-started-for-developers/
- text: Getting started for designers
href: /documentation/getting-started-for-designers/
- href: /documentation/developers/
Copy link
Member Author

Choose a reason for hiding this comment

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

↑ This is the old developers section, now called "Documentation"

Comment on lines +1 to +18
<div class="usa-step-indicator" aria-label="progress">
<ol class="usa-step-indicator__segments">
{% for step in page.steps %}
{% if step.status == "completed" %}
{% assign modifier = "--complete" %}
{% elsif step.status == "current" %}
{% assign modifier = "--current" %}
{% else %}
{% assign modifier = "" %}
{% endif %}
<li class="usa-step-indicator__segment usa-step-indicator__segment{{ modifier }}">
<span class="usa-step-indicator__segment-label"
>{{ step.name }}{% if step.status == "completed" %} <span class="usa-sr-only">completed</span>{% endif %}{% if step.status == "completed" %} <span class="usa-sr-only">not completed</span>{% endif %}</span
>
</li>
{% endfor %}
</ol>
<div class="usa-step-indicator__header">
Copy link
Member Author

Choose a reason for hiding this comment

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

Added a step indicator component for testing, but ended up not implementing it here

@@ -1,7 +1,7 @@
---
permalink: /documentation/developers/
layout: styleguide
title: For developers
title: Documentation
Copy link
Member Author

Choose a reason for hiding this comment

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

The old developer docs. Next step: rewriting and rethinking.

category: How to use USWDS
lead: USWDS offers a flexible yet coherent visual style you can apply to any government website. Our visual style offers a clean, modern aesthetic that meets high standards of usability and accessibility while promoting credibility and trust.
redirect_from:
- /getting-started/designers/
- /documentation/designers/
Copy link
Member Author

Choose a reason for hiding this comment

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

Redirects from the old designers page

- href: /documentation/getting-started/developers/phase-two-compile/
- href: /documentation/getting-started/developers/phase-three-customize/
redirect_from:
- /documentation/fundamentals/
Copy link
Member Author

Choose a reason for hiding this comment

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

Redirects from the old fundamentals and quickstart page

@@ -15,15 +15,15 @@ redirect_from:
<div class="tablet:grid-col display-flex flex-align-stretch">
<div class="site-docs-card-link">
<h3 class="font-lang-lg margin-0">
<a href="{{ site.baseurl }}/getting-started/developers/" class="text-no-underline text-primary hover:text-underline block-link">Developers</a>
<a href="{{ site.baseurl }}/documentation/getting-started-for-developers/" class="text-no-underline text-primary hover:text-underline block-link">Developers</a>
Copy link
Member Author

Choose a reason for hiding this comment

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

Point to Getting Started for Developers page

</h3>
<p class="margin-top-1">Get started with our code base by downloading the code as a zip file, or installing with npm.</p>
</div>
</div>
<div class="margin-top-2 tablet:margin-top-0 tablet:grid-col display-flex flex-align-stretch">
<div class="site-docs-card-link">
<h3 class="font-lang-lg margin-0">
<a href="{{ site.baseurl }}/getting-started/designers/" class="text-no-underline text-primary hover:text-underline block-link">Designers</a>
<a href="{{ site.baseurl }}/documentation/getting-started-for-designers/" class="text-no-underline text-primary hover:text-underline block-link">Designers</a>
Copy link
Member Author

Choose a reason for hiding this comment

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

Point to Getting Started for Designers page

@thisisdano thisisdano requested a review from mejiaj December 6, 2021 17:13
Copy link
Contributor

@mejiaj mejiaj left a comment

Choose a reason for hiding this comment

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

Just a small note on phase-one.md, otherwise LGTM.

{: .site-note.margin-top-0 }
You do want to use the source code, but you don't want to modify it to use it. Instead, in Phase 2, we'll discuss how to compile, theme, and extend the USWDS source code in your project.

**Next:** [Phase 2: Compile &gt;]({{ site.baseurl }}/documentation/getting-started/developers/phase-two-compile/) →
Copy link
Contributor

Choose a reason for hiding this comment

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

Let's remove the &gt; now that we're using the arrow.

Suggested change
**Next:** [Phase 2: Compile &gt;]({{ site.baseurl }}/documentation/getting-started/developers/phase-two-compile/) →
**Next:** [Phase 2: Compile]({{ site.baseurl }}/documentation/getting-started/developers/phase-two-compile/) →

Comment on lines +34 to +58
## Resources
Now that you’ve gotten started, the following resources are available to help you stay in touch, to provide support as you continue with your projects, and to enable you to provide recommendations and feedback.

## Need installation help?
Do you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to [open an issue](https://github.com/uswds/uswds/issues) in GitHub.

You can also email us directly at [uswds@support.digitalgov.gov](mailto:uswds@support.digitalgov.gov).

## Stay involved
USWDS is supported by an active, open-source community of engineers, content specialists, and designers.

## Continue learning
We regularly update USWDS. To stay informed of changes, tips, and tricks, join us for our monthly calls and/or [subscribe to Wave](https://public.govdelivery.com/accounts/USGSATTS/subscriber/new?qsp=GSA_TTS), our newsletter.

## Contribute to the codebase
For complete instructions on how to contribute code, please read [CONTRIBUTING.md](https://github.com/uswds/uswds/blob/develop/CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.

If you would like to learn more about how we work, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on our wiki.

If you have questions or concerns about our contributing workflow, feel free to [open an issue](https://github.com/uswds/uswds/issues), such as the following in GitHub:
- Bug report — Report a bug and help USWDS improve.
- Feature request — Suggest a new idea for the design system.
- Report a security vulnerability — Report potential security issues. Review our [security policy](https://github.com/uswds/uswds/security/policy) for more details.

You can also email us directly at [uswds@support.digitalgov.gov](mailto:uswds@support.digitalgov.gov).
Copy link
Contributor

Choose a reason for hiding this comment

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

Resources should be a separate section comprising all the content beneath it.

We’ve designed USWDS to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The design system follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). In other words, USWDS version 2.0 supports Chrome, Firefox, Safari, Edge, and Internet Explorer 11 and up. The next major version of USWDS (3.0) will drop support of Internet Explorer 11.

## Step-by-step
Get started with USWDS by installing the design system on your project, compiling your project's Sass from the USWDS source, and customizing the design system to fit your project needs.
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
Get started with USWDS by installing the design system on your project, compiling your project's Sass from the USWDS source, and customizing the design system to fit your project needs.
Get started with USWDS by installing the design system on your project, compiling your project's Sass from the USWDS source, and customizing the design system to fit your project needs as outlined in the following phases:

@mejiaj mejiaj deleted the dw-add-getting-started-for-devs branch February 21, 2024 15:45
Sign up for free to 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.

3 participants