Basic webpage set up
Excuse the basic nature of my question. I am very new to this world and through all my Googling I may have only confused myself further.
I want to create a VERY basic webpage for the purpose of practicing code. I want to have an index.html file and styles.css file (javascript at some point later too but not for now)
How do I get from launching Rider for the first time to the point where I have this basic framework waiting for me to have a play around? Unless I am missing something very simple!
I can't seem to find a tutorial for this online. All the training videos I have watched start from the point where the project framework is already set up and it is a generic IDE being used usually too.
Many thanks and apologies in advance!!
Please sign in to leave a comment.
Hello Lee,
JetBrains Rider is primarily designed for .NET development, but you can use it for web development too. Here's a step-by-step guide to set up a basic webpage project with an `index.html` and `styles.css` file in Rider:
1. Launch JetBrains Rider:
• When you first open Rider, you'll see the Welcome screen.
2. Create a New Solution:
• Click on
New Solution
.• From the list on the left, choose
Empty Solution
.• Name your project, for instance, "BasicWebpage".
• Choose a location for your project.
• Click
Create
.3. Add an HTML File:
• Once your solution is open, right-click on the project name in the Solution Explorer (by default on the left side of the screen).
• Switch to
File System
view.• Right-click your solution root folder, click
Add
and then chooseHTML file
.• Name the file
index
and clickOK
.4. Add a CSS File:
• Right-click on the solution root folder again in the Solution Explorer.
• Click
Add
and then chooseFile
.• Name the file
styles.css
and clickOK
.5. Link the CSS File to Your HTML:
• Open the
index.html
file.• Inside the
<head>
tags, add the following line to link to your CSS file:<link rel="stylesheet" type="text/css" href="styles.css">
6. Start Coding!:
• You can now begin adding HTML content to your `index.html` file and styling rules to your
styles.css
file.7. Preview Your Webpage:
• To see how your webpage looks, you can simply right-click on the
index.html
file in the Solution Explorer and chooseRun ‘index.html’
.You should visit MDN Web Docs to get started from basic web development concepts, practice your skill with the guidance.
I hope this helps you get started!