nova-cli 0.1.1 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +62 -48
- data/lib/nova/generator.rb +26 -43
- data/lib/nova/templates/nova.mdc +62 -0
- data/lib/nova/templates/readme_template.md +49 -41
- data/lib/nova/templates/tasks_examples/1_generate_application.md +75 -0
- data/lib/nova/templates/tasks_examples/2_generate_static_pages.md +157 -0
- data/lib/nova/templates/user_story_example.md +59 -67
- data/lib/nova/templates/windsurfrules_template.txt +1 -0
- data/lib/nova.rb +1 -1
- metadata +6 -12
- data/lib/nova/templates/big_picture_readme_template.md +0 -29
- data/lib/nova/templates/design_system_readme_template.md +0 -22
- data/lib/nova/templates/prompts_example.md +0 -134
- data/lib/nova/templates/prompts_examples/01_generate_app.md +0 -94
- data/lib/nova/templates/prompts_examples/02_generate_styleguide.md +0 -26
- data/lib/nova/templates/prompts_examples/03_generate_static_pages.md +0 -26
- data/lib/nova/templates/prompts_examples/04_authentication_feature.md +0 -41
- data/lib/nova/templates/prompts_readme_template.md +0 -27
- data/lib/nova/templates/styleguide_index.html +0 -385
- data/lib/nova/templates/user_stories_readme_template.md +0 -27
- /data/lib/nova/templates/{flowchart_template.md → flowchart_example_template.md} +0 -0
@@ -0,0 +1,157 @@
|
|
1
|
+
# Generate Static Pages
|
2
|
+
|
3
|
+
Prerequisites: Task 1 (Generate Application) must be completed
|
4
|
+
|
5
|
+
## Task Overview
|
6
|
+
Create the actual application pages (with hardcoded data initially) in the code/ directory. These pages will serve as the foundation for the live application - proper routes, controllers, and views that will be enhanced with dynamic functionality later.
|
7
|
+
|
8
|
+
## Prerequisites
|
9
|
+
- Rails application is set up and running (Task 1 completed)
|
10
|
+
- Design system is defined in ../3_design-system/
|
11
|
+
- User stories and flowchart define required pages
|
12
|
+
- Tailwind CSS and Flowbite are configured
|
13
|
+
|
14
|
+
## Important Note
|
15
|
+
These are NOT throwaway prototype pages. Create production-ready routes, controllers, and views that will be used in the final application. Only the data is hardcoded initially.
|
16
|
+
|
17
|
+
## Implementation Strategy
|
18
|
+
**Start with the core of the application first** (e.g., main dashboard, primary user interface, or key feature page). Create this core page completely, then **STOP and let the user review the experience**. Users will likely want to iterate on this core page multiple times before moving to supporting pages. This iterative approach ensures the most important user experience is refined before building out the rest of the application.
|
19
|
+
|
20
|
+
## Tasks
|
21
|
+
|
22
|
+
- [ ] 1.0 Plan Application Structure
|
23
|
+
- [ ] 1.1 Review flowchart in ../1_big-picture/flowchart.md for page requirements
|
24
|
+
- [ ] 1.2 Review user stories in ../2_user-stories/ for page-specific needs
|
25
|
+
- [ ] 1.3 Review design system in ../3_design-system/ for styling guidelines
|
26
|
+
- [ ] 1.4 Identify the CORE page/feature of the application (dashboard, main interface, etc.)
|
27
|
+
- [ ] 1.5 Create list of supporting pages needed
|
28
|
+
- [ ] 1.6 Plan RESTful routes and controller structure
|
29
|
+
|
30
|
+
- [ ] 2.0 Generate Core Controller and Routes FIRST
|
31
|
+
- [ ] 2.1 Generate controller for core feature (e.g., `rails g controller Dashboard index`)
|
32
|
+
- [ ] 2.2 Set up routes for core feature in `config/routes.rb`
|
33
|
+
- [ ] 2.3 **Create only the core routes initially - hold off on other pages**
|
34
|
+
- [ ] 2.4 Ensure core routes follow Rails conventions
|
35
|
+
- [ ] 2.5 Test that core routes are working
|
36
|
+
|
37
|
+
- [ ] 3.0 Create Application Layout for Core Experience
|
38
|
+
- [ ] 3.1 Update `app/views/layouts/application.html.erb` with main structure
|
39
|
+
- [ ] 3.2 Create minimal navigation (just enough for core page)
|
40
|
+
- [ ] 3.3 Focus on the core page's specific layout needs
|
41
|
+
- [ ] 3.4 Implement responsive design for core page
|
42
|
+
- [ ] 3.5 Add any core-specific meta tags
|
43
|
+
|
44
|
+
- [ ] 4.0 Implement Core Page COMPLETELY
|
45
|
+
- [ ] 4.1 Create the main view file (e.g., `app/views/dashboard/index.html.erb`)
|
46
|
+
- [ ] 4.2 Add all hardcoded data needed for realistic experience
|
47
|
+
- [ ] 4.3 Implement all UI components for this page
|
48
|
+
- [ ] 4.4 Add interactive elements (dropdowns, modals, etc.)
|
49
|
+
- [ ] 4.5 Ensure responsive design works perfectly
|
50
|
+
- [ ] 4.6 Polish with transitions and hover states
|
51
|
+
- [ ] 4.7 **STOP HERE - Let user review and iterate**
|
52
|
+
|
53
|
+
**🛑 PAUSE POINT: After completing the core page, stop and let the user review. They will likely want to iterate on styling, layout, and functionality before proceeding.**
|
54
|
+
|
55
|
+
- [ ] 5.0 After Core Page Approval - Generate Supporting Controllers
|
56
|
+
- [ ] 5.1 Generate PagesController for static pages: `rails g controller Pages home about contact`
|
57
|
+
- [ ] 5.2 Generate other resource controllers based on flowchart
|
58
|
+
- [ ] 5.3 Set up remaining routes in `config/routes.rb`
|
59
|
+
- [ ] 5.4 Ensure all routes follow Rails conventions
|
60
|
+
- [ ] 5.5 Test all routes are working
|
61
|
+
|
62
|
+
- [ ] 6.0 Expand Navigation and Layout
|
63
|
+
- [ ] 6.1 Create full navigation partial: `app/views/shared/_navigation.html.erb`
|
64
|
+
- [ ] 6.2 Create footer partial: `app/views/shared/_footer.html.erb`
|
65
|
+
- [ ] 6.3 Update layout to work for all pages
|
66
|
+
- [ ] 6.4 Ensure navigation highlights current page
|
67
|
+
- [ ] 6.5 Add mobile menu functionality
|
68
|
+
|
69
|
+
- [ ] 7.0 Implement Supporting Pages
|
70
|
+
- [ ] 7.1 Create homepage if not the core page
|
71
|
+
- [ ] 7.2 Create about page
|
72
|
+
- [ ] 7.3 Create contact page
|
73
|
+
- [ ] 7.4 Create other resource views (index, show)
|
74
|
+
- [ ] 7.5 Ensure consistent styling across all pages
|
75
|
+
|
76
|
+
- [ ] 8.0 Define Structs and Add Sample Data
|
77
|
+
- [ ] 8.1 Define Structs for all data types at top of controllers
|
78
|
+
- [ ] 8.2 Create realistic sample data arrays
|
79
|
+
- [ ] 8.3 Implement show actions with find logic
|
80
|
+
- [ ] 8.4 Add methods to Structs that mimic ActiveRecord
|
81
|
+
- [ ] 8.5 Document all Struct attributes
|
82
|
+
|
83
|
+
```ruby
|
84
|
+
# Example Struct definition
|
85
|
+
Product = Struct.new(:id, :name, :slug, :price, :description,
|
86
|
+
:image_url, :category, :in_stock, :created_at,
|
87
|
+
keyword_init: true) do
|
88
|
+
def to_param
|
89
|
+
slug
|
90
|
+
end
|
91
|
+
|
92
|
+
def formatted_price
|
93
|
+
"$%.2f" % price
|
94
|
+
end
|
95
|
+
end
|
96
|
+
```
|
97
|
+
|
98
|
+
- [ ] 9.0 Create Reusable Components
|
99
|
+
- [ ] 9.1 Extract repeated UI into partials
|
100
|
+
- [ ] 9.2 Create card partial: `app/views/shared/_card.html.erb`
|
101
|
+
- [ ] 9.3 Create button components
|
102
|
+
- [ ] 9.4 Create form components
|
103
|
+
- [ ] 9.5 Document component usage
|
104
|
+
|
105
|
+
- [ ] 10.0 Testing and Validation
|
106
|
+
- [ ] 10.1 Write controller tests
|
107
|
+
- [ ] 10.2 Create system tests for user flows
|
108
|
+
- [ ] 10.3 Add E2E tests with Cypress
|
109
|
+
- [ ] 10.4 Test all responsive breakpoints
|
110
|
+
- [ ] 10.5 Validate accessibility
|
111
|
+
|
112
|
+
- [ ] 11.0 Prepare for Dynamic Data
|
113
|
+
- [ ] 11.1 Add TODO comments for database queries
|
114
|
+
- [ ] 11.2 Create seed file matching Struct data
|
115
|
+
- [ ] 11.3 Document data relationships
|
116
|
+
- [ ] 11.4 Plan model structure
|
117
|
+
- [ ] 11.5 Note where authentication will be added
|
118
|
+
|
119
|
+
## File Tracking
|
120
|
+
|
121
|
+
### Core Page Files (Create First)
|
122
|
+
| File Path | Purpose | Task Ref | Status |
|
123
|
+
|-----------|---------|----------|--------|
|
124
|
+
| Core controller (e.g., `app/controllers/dashboard_controller.rb`) | Core feature controller | 2.1 | ⏳ |
|
125
|
+
| Core view (e.g., `app/views/dashboard/index.html.erb`) | Main application view | 4.1 | ⏳ |
|
126
|
+
| `app/views/layouts/application.html.erb` | Initial layout | 3.1 | ⏳ |
|
127
|
+
|
128
|
+
### Supporting Files (Create After Core Review)
|
129
|
+
| File Path | Purpose | Task Ref | Status |
|
130
|
+
|-----------|---------|----------|--------|
|
131
|
+
| `app/controllers/pages_controller.rb` | Static pages | 5.1 | ⏳ |
|
132
|
+
| `app/views/shared/_navigation.html.erb` | Full navigation | 6.1 | ⏳ |
|
133
|
+
| `app/views/shared/_footer.html.erb` | Footer partial | 6.2 | ⏳ |
|
134
|
+
| `app/views/pages/*.html.erb` | Supporting pages | 7.1-7.4 | ⏳ |
|
135
|
+
| `app/views/shared/_card.html.erb` | Card component | 9.2 | ⏳ |
|
136
|
+
| `spec/system/*_spec.rb` | System tests | 10.2 | ⏳ |
|
137
|
+
| `db/seeds.rb` | Seed data | 11.2 | ⏳ |
|
138
|
+
|
139
|
+
### Files to Modify
|
140
|
+
| File Path | Changes | Task Ref | Status |
|
141
|
+
|-----------|---------|----------|--------|
|
142
|
+
| `config/routes.rb` | Add routes incrementally | 2.2, 5.3 | ⏳ |
|
143
|
+
|
144
|
+
## Core-First Development Benefits
|
145
|
+
|
146
|
+
1. **User Feedback Early**: Get the most important page right before building everything else
|
147
|
+
2. **Design System Validation**: Test your design system on the most complex page first
|
148
|
+
3. **Efficient Iteration**: Changes to core page inform decisions for other pages
|
149
|
+
4. **Clear Priorities**: Focus effort where it matters most
|
150
|
+
5. **Reduced Rework**: Avoid building pages that might change based on core page decisions
|
151
|
+
|
152
|
+
## Next Steps After Static Pages Complete
|
153
|
+
- Replace Structs with ActiveRecord models
|
154
|
+
- Add authentication and authorization
|
155
|
+
- Implement forms and CRUD operations
|
156
|
+
- Add dynamic features (search, filtering)
|
157
|
+
- Enhance with real-time updates
|
@@ -1,83 +1,75 @@
|
|
1
|
-
# User Story:
|
1
|
+
# User Story: [Feature Name]
|
2
2
|
|
3
|
-
|
3
|
+
**As a** [type of user]
|
4
|
+
**I want** [goal/desire]
|
5
|
+
**So that** [benefit/value]
|
4
6
|
|
5
|
-
|
6
|
-
|
7
|
-
**So that** I can regain access to my account without contacting support.
|
7
|
+
## Context
|
8
|
+
[1-2 sentences providing background on why this feature is needed]
|
8
9
|
|
9
|
-
##
|
10
|
-
```mermaid
|
11
|
-
flowchart TD
|
12
|
-
HomePage --> LoginPage
|
13
|
-
LoginPage --> ForgotPasswordPage
|
14
|
-
ForgotPasswordPage --> ResetPasswordEmail
|
15
|
-
ResetPasswordEmail --> ResetPasswordPage
|
16
|
-
ResetPasswordPage --> Dashboard
|
17
|
-
```
|
10
|
+
## Scenarios
|
18
11
|
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
4. New password must meet security requirements (8+ chars, 1 uppercase, 1 number)
|
25
|
-
5. User receives confirmation after successful password reset and is automatically logged in
|
26
|
-
6. Reset links expire after x hours
|
27
|
-
|
28
|
-
## Pages, Major Components, and Forms
|
29
|
-
|
30
|
-
### Forgot Password Page
|
31
|
-
**Form**:
|
32
|
-
- Email:
|
33
|
-
- Required
|
34
|
-
- Validate email format
|
35
|
-
- Submit Button
|
12
|
+
### Happy Path
|
13
|
+
1. User navigates to [starting point]
|
14
|
+
2. User performs [action]
|
15
|
+
3. System responds with [result]
|
16
|
+
4. User achieves [goal]
|
36
17
|
|
37
|
-
###
|
38
|
-
-
|
18
|
+
### Edge Cases
|
19
|
+
- What happens if [condition]?
|
20
|
+
- What happens when [error state]?
|
39
21
|
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
-
|
45
|
-
- Required
|
46
|
-
- Validate: 8 characters, 1 upper, 1 special character
|
47
|
-
- Confirm New Password
|
48
|
-
- Validate: Matches new password
|
49
|
-
- Submit Button
|
50
|
-
|
51
|
-
### Dashboard
|
52
|
-
After resetting password user should be logged in and lands on the dashbard where they see a toast message confirming successful password reset
|
22
|
+
## Acceptance Criteria
|
23
|
+
- [ ] User can [primary action]
|
24
|
+
- [ ] System validates [key requirement]
|
25
|
+
- [ ] User receives [feedback/confirmation]
|
26
|
+
- [ ] [Security/business rule] is enforced
|
53
27
|
|
54
|
-
##
|
28
|
+
## Key Screens
|
29
|
+
[List the main screens/pages involved without detailed field specifications]
|
55
30
|
|
56
|
-
|
57
|
-
-
|
31
|
+
## Questions
|
32
|
+
- [ ] [Any unknowns that need clarification]
|
58
33
|
|
59
|
-
|
34
|
+
---
|
60
35
|
|
61
|
-
|
36
|
+
## Example: Password Reset
|
62
37
|
|
63
|
-
|
38
|
+
**As a** registered user
|
39
|
+
**I want** to reset my forgotten password
|
40
|
+
**So that** I can regain access to my account without contacting support
|
64
41
|
|
65
|
-
|
42
|
+
## Context
|
43
|
+
Users occasionally forget their passwords and need a self-service way to regain access that doesn't burden our support team.
|
66
44
|
|
67
|
-
##
|
45
|
+
## Scenarios
|
68
46
|
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
add_index :users, :email, unique: true
|
76
|
-
```
|
47
|
+
### Happy Path
|
48
|
+
1. User clicks "Forgot password?" on login page
|
49
|
+
2. User enters their email address
|
50
|
+
3. System sends reset email with secure link
|
51
|
+
4. User clicks link and sets new password
|
52
|
+
5. User is logged in and redirected to dashboard
|
77
53
|
|
78
|
-
|
54
|
+
### Edge Cases
|
55
|
+
- Non-existent email: Show generic "If email exists, reset sent" message
|
56
|
+
- Expired link: Show friendly error with option to request new link
|
57
|
+
- User already logged in: Redirect to account settings
|
79
58
|
|
80
|
-
|
81
|
-
-
|
82
|
-
-
|
83
|
-
-
|
59
|
+
## Acceptance Criteria
|
60
|
+
- [ ] Reset link accessible from login page
|
61
|
+
- [ ] Email sent within 2 minutes of request
|
62
|
+
- [ ] Password requirements clearly shown (8+ chars, mixed case, number)
|
63
|
+
- [ ] Reset links expire after 24 hours
|
64
|
+
- [ ] Success confirmation shown after reset
|
65
|
+
- [ ] Only one active reset link per user at a time
|
66
|
+
|
67
|
+
## Key Screens
|
68
|
+
- Login page (with forgot password link)
|
69
|
+
- Request reset page (email entry)
|
70
|
+
- Reset password page (new password entry)
|
71
|
+
- Success/confirmation page
|
72
|
+
|
73
|
+
## Questions
|
74
|
+
- [ ] Should we notify users when a reset is requested for security?
|
75
|
+
- [ ] Do we want to implement rate limiting for reset requests?
|
@@ -0,0 +1 @@
|
|
1
|
+
This Nova project uses cursor rules for AI guidance located at .cursor/rules/nova.mdc. Please review before proceeding.
|
data/lib/nova.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: nova-cli
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.
|
4
|
+
version: 0.2.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Ryan Francis
|
@@ -38,21 +38,15 @@ files:
|
|
38
38
|
- lib/nova.rb
|
39
39
|
- lib/nova/cli.rb
|
40
40
|
- lib/nova/generator.rb
|
41
|
-
- lib/nova/templates/big_picture_readme_template.md
|
42
41
|
- lib/nova/templates/design_decisions_example.md
|
43
|
-
- lib/nova/templates/
|
44
|
-
- lib/nova/templates/
|
42
|
+
- lib/nova/templates/flowchart_example_template.md
|
43
|
+
- lib/nova/templates/nova.mdc
|
45
44
|
- lib/nova/templates/prd_example_template.md
|
46
|
-
- lib/nova/templates/prompts_example.md
|
47
|
-
- lib/nova/templates/prompts_examples/01_generate_app.md
|
48
|
-
- lib/nova/templates/prompts_examples/02_generate_styleguide.md
|
49
|
-
- lib/nova/templates/prompts_examples/03_generate_static_pages.md
|
50
|
-
- lib/nova/templates/prompts_examples/04_authentication_feature.md
|
51
|
-
- lib/nova/templates/prompts_readme_template.md
|
52
45
|
- lib/nova/templates/readme_template.md
|
53
|
-
- lib/nova/templates/
|
54
|
-
- lib/nova/templates/
|
46
|
+
- lib/nova/templates/tasks_examples/1_generate_application.md
|
47
|
+
- lib/nova/templates/tasks_examples/2_generate_static_pages.md
|
55
48
|
- lib/nova/templates/user_story_example.md
|
49
|
+
- lib/nova/templates/windsurfrules_template.txt
|
56
50
|
homepage: https://github.com/LaunchPadLab/nova
|
57
51
|
licenses:
|
58
52
|
- MIT
|
@@ -1,29 +0,0 @@
|
|
1
|
-
# 1. Big Picture
|
2
|
-
|
3
|
-
This directory contains high-level strategic documents that define the background, vision, and goals of the project.
|
4
|
-
|
5
|
-
## Purpose
|
6
|
-
|
7
|
-
The Big Picture documents establish the foundation and direction for the entire project. They help stakeholders align on objectives and priorities before diving into more detailed planning.
|
8
|
-
|
9
|
-
## Files in this Directory
|
10
|
-
|
11
|
-
- **prd_example.md**: Defines a blueprint for the product.
|
12
|
-
- **flowchart.md**: Visual representation of the application's user flow using Mermaid diagrams
|
13
|
-
|
14
|
-
## How to Use
|
15
|
-
|
16
|
-
1. Create a new PRD file at 1_big-picture/prd.md and use 1_big-picture/prd_example.md as a template
|
17
|
-
2. Create visual application flows in flowchart.md to illustrate user journeys
|
18
|
-
|
19
|
-
## Best Practices
|
20
|
-
|
21
|
-
- Involve all key stakeholders in defining the Big Picture
|
22
|
-
- Keep these documents high-level and focused on strategy (details come later)
|
23
|
-
- Revisit and update these documents as the project evolves
|
24
|
-
- Use clear, concise language that all stakeholders can understand
|
25
|
-
- Use flowcharts to communicate complex user journeys visually
|
26
|
-
|
27
|
-
## Next Steps
|
28
|
-
|
29
|
-
After completing the Big Picture documents, move on to [2_user-stories](../2_user-stories) to begin breaking down the product into more detailed user stories.
|
@@ -1,22 +0,0 @@
|
|
1
|
-
# Design System
|
2
|
-
|
3
|
-
The Design System directory contains the visual language and UI component documentation for your application. It builds on the PRD and user stories and provides a consistent framework for implementing the user interface.
|
4
|
-
|
5
|
-
## Purpose
|
6
|
-
|
7
|
-
A design system serves as a centralized resource for design guidelines, UI components, patterns, and principles. It ensures consistency, improves collaboration between designers and developers, and accelerates implementation.
|
8
|
-
|
9
|
-
## Directory Structure
|
10
|
-
|
11
|
-
The design system is organized as follows:
|
12
|
-
|
13
|
-
```
|
14
|
-
3_design-system/
|
15
|
-
├── README.md (this file)
|
16
|
-
└── design_decisions.md
|
17
|
-
```
|
18
|
-
|
19
|
-
## Design System Implementation
|
20
|
-
|
21
|
-
1. **Review the PRD and user stories** to ensure visual consistency with the brand and planned user experience
|
22
|
-
2. **Document design decisions** in the `design_decisions.md` file, including color palette, typography, spacing, and component styles
|
@@ -1,134 +0,0 @@
|
|
1
|
-
# Project Implementation Tasks
|
2
|
-
|
3
|
-
A list of implementation tasks for the Customer Portal Application.
|
4
|
-
|
5
|
-
## 1. Rails Application Setup
|
6
|
-
Initialize a Rails 8 application with PostgreSQL, Tailwind CSS, Rspec, and Flowbite.
|
7
|
-
|
8
|
-
```
|
9
|
-
rails _8.0.2_ new app_name --database=postgresql --css=tailwind
|
10
|
-
cd app_name
|
11
|
-
bundle exec rails tailwindcss:install
|
12
|
-
bundle exec rails db:create db:migrate
|
13
|
-
bundle exec rails rspec:install
|
14
|
-
```
|
15
|
-
|
16
|
-
Create a Hello World page that is styled with Tailwind CSS and Flowbite (simple tooltip) so we can confirm both are working.
|
17
|
-
|
18
|
-
### Flowbite Setup
|
19
|
-
Importmap is the default way of handling JavaScript in Rails. In order to support turbo load from importmaps you have to pin the flowbite.turbo.js file from a CDN where the turbo:load event listeners are added instead of load.
|
20
|
-
|
21
|
-
Add the following line inside your importmap.rb file:
|
22
|
-
pin "flowbite", to: "https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.turbo.min.js"
|
23
|
-
Then you need to import flowbite inside your application.js file:
|
24
|
-
import 'flowbite';
|
25
|
-
This will enable the interactive elements like dropdowns, modals, and navbars work by hooking the event listeners and actions to the data attributes whenever a new page is loaded in your application.
|
26
|
-
|
27
|
-
### Gems
|
28
|
-
- Figaro for env variables
|
29
|
-
- Decanter for handling incoming params: https://github.com/LaunchPadLab/decanter
|
30
|
-
- Active Storage (for file attachments)
|
31
|
-
|
32
|
-
Testing:
|
33
|
-
- Factory Bot for testing
|
34
|
-
- Faker
|
35
|
-
- DatabaseCleaner
|
36
|
-
- Shoulda Matchers
|
37
|
-
- RSpec Rails
|
38
|
-
- Capybara
|
39
|
-
- SimpleCov
|
40
|
-
|
41
|
-
**Related Artifacts:**
|
42
|
-
- [PRD](../1_big-picture/prd.md)
|
43
|
-
|
44
|
-
## 2. Authentication System
|
45
|
-
Implement user registration, login functionality, password reset, and role-based permissions using Devise.
|
46
|
-
|
47
|
-
**Related Artifacts:**
|
48
|
-
- [Authentication Requirements](../1_big-picture/prd_example.md#authentication)
|
49
|
-
- [User Flow](../1_big-picture/flowchart.md#authentication-flow)
|
50
|
-
- [Login User Story](../2_user-stories/authentication.md#user-login)
|
51
|
-
- [Registration User Story](../2_user-stories/authentication.md#user-registration)
|
52
|
-
|
53
|
-
## 3. Core Database Structure
|
54
|
-
Design the database schema, create models with associations, set up validations, and implement seed data for development.
|
55
|
-
|
56
|
-
**Related Artifacts:**
|
57
|
-
- [Data Model Overview](../1_big-picture/prd_example.md#data-model)
|
58
|
-
- [Entity Relationship Diagram](../1_big-picture/flowchart.md#entity-relationships)
|
59
|
-
- [Data Requirements](../2_user-stories/data_requirements.md)
|
60
|
-
|
61
|
-
## 4. Dashboard Implementation
|
62
|
-
Create a responsive dashboard with quick stats widgets, activity feed, and notification system.
|
63
|
-
|
64
|
-
**Related Artifacts:**
|
65
|
-
- [Dashboard Requirements](../1_big-picture/prd_example.md#dashboard)
|
66
|
-
- [Dashboard User Story](../2_user-stories/dashboard.md)
|
67
|
-
|
68
|
-
## 5. Customer Management
|
69
|
-
Build CRUD operations for customer data with search, filtering, detailed views, and history tracking.
|
70
|
-
|
71
|
-
**Related Artifacts:**
|
72
|
-
- [Customer Management Requirements](../1_big-picture/prd_example.md#customer-management)
|
73
|
-
- [Customer User Stories](../2_user-stories/customers.md)
|
74
|
-
|
75
|
-
## 6. Document Management
|
76
|
-
Implement document upload, versioning, PDF generation for invoices, and document sharing capabilities.
|
77
|
-
|
78
|
-
**Related Artifacts:**
|
79
|
-
- [Document Management Requirements](../1_big-picture/prd_example.md#document-management)
|
80
|
-
- [Document Flow](../1_big-picture/flowchart.md#document-flow)
|
81
|
-
- [Document User Stories](../2_user-stories/documents.md)
|
82
|
-
|
83
|
-
## 7. Reporting System
|
84
|
-
Create report templates with data aggregation, visual charts, and export functionality.
|
85
|
-
|
86
|
-
**Related Artifacts:**
|
87
|
-
- [Reporting Requirements](../1_big-picture/prd_example.md#reporting)
|
88
|
-
- [Report User Stories](../2_user-stories/reports.md)
|
89
|
-
|
90
|
-
## 8. API Integration
|
91
|
-
Design API endpoints with authentication, third-party integrations, and webhook functionality.
|
92
|
-
|
93
|
-
**Related Artifacts:**
|
94
|
-
- [API Requirements](../1_big-picture/prd_example.md#api-integration)
|
95
|
-
- [Integration Flow](../1_big-picture/flowchart.md#integration-flow)
|
96
|
-
- [API User Stories](../2_user-stories/api.md)
|
97
|
-
|
98
|
-
## 9. Real-time Features
|
99
|
-
Implement WebSocket connections for real-time notifications, collaborative editing, and chat functionality.
|
100
|
-
|
101
|
-
**Related Artifacts:**
|
102
|
-
- [Real-time Requirements](../1_big-picture/prd_example.md#real-time-features)
|
103
|
-
- [Real-time Communication Flow](../1_big-picture/flowchart.md#real-time-flow)
|
104
|
-
- [Chat User Story](../2_user-stories/real_time.md#chat)
|
105
|
-
- [Notification User Story](../2_user-stories/real_time.md#notifications)
|
106
|
-
|
107
|
-
## 10. Performance Optimization
|
108
|
-
Implement caching, optimize database queries, set up background job processing, and conduct load testing.
|
109
|
-
|
110
|
-
**Related Artifacts:**
|
111
|
-
- [Performance Requirements](../1_big-picture/prd_example.md#performance)
|
112
|
-
- [System Load Estimates](../1_big-picture/prd_example.md#load-estimates)
|
113
|
-
|
114
|
-
## 11. Security Hardening
|
115
|
-
Perform security audit, implement security measures, set up monitoring and logging.
|
116
|
-
|
117
|
-
**Related Artifacts:**
|
118
|
-
- [Security Requirements](../1_big-picture/prd_example.md#security)
|
119
|
-
- [Privacy Requirements](../1_big-picture/prd_example.md#privacy)
|
120
|
-
- [Security User Stories](../2_user-stories/security.md)
|
121
|
-
|
122
|
-
## 12. Deployment & Launch
|
123
|
-
Finalize production environment, create deployment scripts, develop rollback procedures, and execute launch.
|
124
|
-
|
125
|
-
**Related Artifacts:**
|
126
|
-
- [Deployment Strategy](../1_big-picture/prd_example.md#deployment)
|
127
|
-
- [Launch Plan](../1_big-picture/prd_example.md#launch-plan)
|
128
|
-
- [Rollback Procedures](../1_big-picture/prd_example.md#rollback)
|
129
|
-
|
130
|
-
### Production Gems
|
131
|
-
- Redis (for caching)
|
132
|
-
- Sidekiq (for background jobs)
|
133
|
-
- Sentry (for error tracking)
|
134
|
-
- Aws S3 (for file storage)
|
@@ -1,94 +0,0 @@
|
|
1
|
-
# Generate Application
|
2
|
-
|
3
|
-
This prompt is for the initial setup of the Rails application with the core dependencies required for the project.
|
4
|
-
|
5
|
-
## Task Description
|
6
|
-
|
7
|
-
Initialize a Rails 8 application with PostgreSQL, Tailwind CSS, Rspec, Flowbite, and Cypress.
|
8
|
-
|
9
|
-
### Steps
|
10
|
-
|
11
|
-
1. Create a new Rails application with the following command:
|
12
|
-
```
|
13
|
-
rails _8.0.2_ new app_name --database=postgresql --css=tailwind
|
14
|
-
cd app_name
|
15
|
-
bundle exec rails tailwindcss:install
|
16
|
-
bundle exec rails db:create db:migrate
|
17
|
-
bundle exec rails rspec:install
|
18
|
-
```
|
19
|
-
|
20
|
-
**Tailwind Note**: Please read the latest v4 docs here before trying to work with Tailwind as a lot has changed since v3 such as the ability to load colors in global.css instead of needing a tailwind config file: https://tailwindcss.com/blog/tailwindcss-v4
|
21
|
-
|
22
|
-
Make sure rspec works: `bundle exec rspec`
|
23
|
-
|
24
|
-
2. Set up the following gems in the Gemfile:
|
25
|
-
|
26
|
-
#### Core Gems
|
27
|
-
- Figaro (for environment variables)
|
28
|
-
- Decanter (for handling incoming params): https://github.com/LaunchPadLab/decanter
|
29
|
-
- Active Storage (for file attachments)
|
30
|
-
|
31
|
-
#### Testing Gems
|
32
|
-
- Factory Bot Rails
|
33
|
-
- Faker
|
34
|
-
- DatabaseCleaner
|
35
|
-
- Shoulda Matchers
|
36
|
-
- RSpec Rails
|
37
|
-
- Capybara
|
38
|
-
- SimpleCov
|
39
|
-
|
40
|
-
#### Production Gems
|
41
|
-
- Redis (for caching)
|
42
|
-
- Sidekiq (for background jobs)
|
43
|
-
- Sentry (for error tracking)
|
44
|
-
- AWS S3 SDK (for file storage)
|
45
|
-
|
46
|
-
3. Set up Flowbite for interactive components:
|
47
|
-
|
48
|
-
Importmap is the default way of handling JavaScript in Rails. To support turbo load:
|
49
|
-
|
50
|
-
Add the following line inside your importmap.rb file:
|
51
|
-
```ruby
|
52
|
-
pin "flowbite", to: "https://cdn.jsdelivr.net/npm/flowbite@3.1.2/dist/flowbite.turbo.min.js"
|
53
|
-
```
|
54
|
-
|
55
|
-
Then import flowbite inside your application.js file:
|
56
|
-
```javascript
|
57
|
-
import 'flowbite';
|
58
|
-
```
|
59
|
-
|
60
|
-
4. Create a Hello World page with Tailwind CSS and Flowbite to confirm both are working properly:
|
61
|
-
- Include a simple styled page
|
62
|
-
- Add a simple Flowbite component (tooltip) for testing
|
63
|
-
|
64
|
-
5. Set up Cypress for headless E2E testing:
|
65
|
-
```bash
|
66
|
-
yarn add cypress --dev
|
67
|
-
```
|
68
|
-
|
69
|
-
Create a simple E2E test for the Hello World page:
|
70
|
-
```javascript
|
71
|
-
// cypress/e2e/hello_world_spec.cy.js
|
72
|
-
describe('Hello World Page', () => {
|
73
|
-
it('successfully loads', () => {
|
74
|
-
cy.visit('http://localhost:3000')
|
75
|
-
cy.contains('Hello World')
|
76
|
-
cy.get('[data-tooltip-target]').should('exist')
|
77
|
-
})
|
78
|
-
})
|
79
|
-
```
|
80
|
-
|
81
|
-
Add script to package.json for headless testing:
|
82
|
-
```json
|
83
|
-
"scripts": {
|
84
|
-
"test:e2e": "cypress run"
|
85
|
-
}
|
86
|
-
```
|
87
|
-
|
88
|
-
Run the test headlessly:
|
89
|
-
```bash
|
90
|
-
yarn test:e2e
|
91
|
-
```
|
92
|
-
|
93
|
-
## Related Artifacts
|
94
|
-
- [PRD](../1_big-picture/prd.md)
|
@@ -1,26 +0,0 @@
|
|
1
|
-
# Generate Static Styleguide
|
2
|
-
|
3
|
-
This prompt is for creating a static styleguide application based on the design system decisions, user stories, PRD, and flowchart.
|
4
|
-
|
5
|
-
## Task Description
|
6
|
-
|
7
|
-
Using the design decisions from `../3_design-system/design_decisions.md`, create a styleguide within the application (in the code/ directory) that showcase the colors, typography, componentry, and example forms. Please nest all pages within this under /styleguide route as follows:
|
8
|
-
- Styleguide Home: /styleguide
|
9
|
-
- Colors: /styleguide/colors
|
10
|
-
- Typography: /styleguide/typography
|
11
|
-
- Componentry: /styleguide/componentry
|
12
|
-
- Forms: /styleguide/forms
|
13
|
-
- Authenticated Layout: /styleguide/authenticated
|
14
|
-
- Unauthenticated Layout: /styleguide/unauthenticated
|
15
|
-
|
16
|
-
Create the static styleguide with:
|
17
|
-
- Tailwind CSS for utility-based styling
|
18
|
-
- Flowbite for interactive components (modals, tooltips, etc.)
|
19
|
-
- HTML structure that follows the design system
|
20
|
-
|
21
|
-
**Tailwind Note**: Please read the latest v4 docs here before trying to work with Tailwind as a lot has changed since v3 such as the ability to load colors in global.css instead of needing a tailwind config file: https://tailwindcss.com/blog/tailwindcss-v4
|
22
|
-
|
23
|
-
## Related Artifacts
|
24
|
-
- [PRD](../1_big-picture/prd.md)
|
25
|
-
- [Flowchart](../1_big-picture/flowchart.md)
|
26
|
-
- [Design Decisions](../3_design-system/design_decisions.md)
|