Build a Survey Form

Source: Dev.to

Project Overview

Despite having written a couple of posts on DEV, I was still able to complete the HTML Tables and Forms quiz on freeCodeCamp yesterday. That led me to the Build a Survey Form – the first certification project in the Responsive Web Design curriculum.

The project follows sixteen user stories. Once all are fulfilled, the project is considered complete. Like earlier labs, it provides an example of the finished result and some starter HTML boilerplate.

Starter Boilerplate

  
    
    Survey Form
  

  

Form Implementation

I began by structuring the body with an “ heading, a descriptive paragraph, and the form itself. The form includes:

• Text, email, and number fields (the number field uses a dropdown for selection)
• Checkboxes
• Radio buttons
• A textarea for additional comments

Instead of copying the example verbatim, I gave it a personal twist by building a DEV Community feedback form.

Completed Survey Form Code

  
    
    Survey Form
  

  
    
## DEV Community Feedback Form

    
Help us improve our community by filling in this form.

    

      Name:
      

      Email:
      

      Age:
      

      
Which option best describes your current experience level?

      
        Select your experience
        Beginner
        Junior
        Senior
      

      
Would you recommend DEV Community to a friend/colleague?

      
        
        Yes
      
      
        
        No
      

      
What would you like to see improved? (Check all that apply)

      
        
        Articles
      
      
        
        Moderation
      
      
        
        Onboarding
      

      
Any further suggestions to improve our community?

      

      Submit

    
  

Next Steps

The HTML portion of the Responsive Web Design certification is nearly complete, with only the accessibility subsection remaining. I’ll share more about that next time. As always—keep coding!