This reference document describes the components of DEV's user interface (UI) for users unfamiliar with the DEV website.
On the DEV homepage, after logging into your account, you'll see:
- A sidebar
- A social feed
- Listings
- Trending tags, and
- A Create Post button
The sidebar serves as DEV's navigation system that contains the following menu items.
| Menu Item | Description |
|---|---|
| 🏡 Home | Navigates you to DEV's homepage. |
| 🗃 Reading List | Navigates you to your bookmarked DEV posts. |
| 🎙 Podcasts | Navigates you to DEV's Podcasts page, where you can discover tech-related podcasts. |
| 🎥 Video | Navigates you to the DEV Community on Video page, where you can peruse and watch videos posted on DEV. |
| 🏷 Tags | Navigates you to the Top Tags page that lists and defines popular DEV tags to follow. |
| 💡 FAQ | Navigates you to the Frequently Asked Questions page, where you can find answers to questions you may have. |
| 🛍 Forem Shop | Navigates you to the Forem store. |
| ❤️ Sponsors | Navigates you to the Sponsorship Options page, where you can learn about DEV's current sponsors, how you can become a sponsor, and access the Sponsorship Interest Form. |
| About | Navigates you to the About DEV page, where you can learn more about DEV. |
| Contact | Navigates you to the Contacts page, where you can find DEV's contact information. |
The Other is a subsection within the sidebar that contains the following menu items.
| Menu Item | Description |
|---|---|
| 👍 Code of Conduct | Navigates you to DEV's Code of Conduct page, where you can learn DEV's rules and proper practices for community members to follow. |
| 🤓 Privacy Policy | Navigates you to DEV's Privacy Policy page, where you can learn about how DEV collects, safeguards, and manages your information. |
| 👀 Terms of Use | Navigates you to DEV's Web Site Terms and Conditions of Use page that discloses the rules, conditions, limitations, and other details that DEV and community members must agree to when using the website. |
Social icons are included in the sidebar that links to DEV's social media accounts, which include the following:
- GitHub
- Twitch
The My Tags is a subsection in the sidebar that lists tags you currently follow.
Adjacent to the My Tags title, you can click the Customize tag priority button to change the order of your tags.
The social feed displays DEV posts. You can filter DEV posts by selecting:
- Relevant
- Latest, and
- Top
Reference the table below to learn what each social feed filter means.
| Filter | Description |
|---|---|
| Relevant | The Relevant filter displays DEV posts with tags you follow. |
| Latest | The Latest filter displays new DEV posts. |
| Top | The Top filter displays popular and trending DEV posts. |
Displays job posts, events, new products, and other listings. You can view more listings by clicking See all where you can find and filter active listings to narrow your search. You can also create a new listing.
Displays popular tags that are being used in DEV posts.
A button that allows you to create a new DEV post.
Allows you to create and edit a DEV post.
Reference the following table to learn about DEV's editor components.
| Component | Description |
|---|---|
| Add a cover image | Lets you upload a cover picture for your DEV post. |
| Add up to 4 tags... | Lets you add up to four tags relevant to your DEV post. Upon clicking, it automatically provides a dropdown showing suggestions of trending tags, or you can create a new tag. |
| Toolbar | Provides editing tools for creating your content, such as bolding and italicizing text, using ordered or unordered lists, creating headings, calling out quotes, displaying code, using code blocks, and adding images. |
| ⋮ (vertically aligned ellipsis) | Lets you view and use more editing tools, including underlining and strikethrough text, a line divider, and a button to view DEV's editor guide. |
| Write your post content here... | Lets you type and create the content of your post in Markdown. |
| Publish | Lets you publish your DEV post for public viewing. |
| Save draft | Lets you save your DEV post as a draft, allowing you to revisit your unpublished post later. |
| Post options | Lets you change the canonical URL, and if your post is or will be a part of a series, you can create a unique name for the series. |
| Edit | Lets you edit your DEV post after it's published or saved as a draft. |
| Preview | Lets you see how your DEV post will render. |