Easy Steps to Setup Your First Solid.js Project

as the world is just crazy behind the react.js framework from the developers to the companies. there's one more thing which catches our attention is solid.js framework . i have no experience in react.js but just had a slight relation for sometime , because of my brother . he was working on his projects and along with forcing me to also get my hands dirty in code and learn something . but never could satisfy his expectations , i failed each time he gave me work .

but I have been using Solid.js since few months and so will be documenting it here, first step starts with setting up the project

prerequisites to know, its not mandatory to have complete knowledge of these, but you are someone who knows these prerequisites gonna find it easy to understand and ones just getting started no worries will explain what I understood :

• HTML

• CSS

• Javascript(at least basics)

let's get started creating our first solid.js application :

1. Install Node.js :

   here's the official website link of node.js you can download it as per your local machine from here .

   once Node.js is installed, you can verify the installation by running the following commands in your terminal:

node -v
npm -v

These commands will display the installed versions of Node.js and npm (Node Package Manager), respectively.

Node.js is a JavaScript runtime environment that allows you to run JavaScript code on the server side. Additionally, it comes with npm (Node Package Manager), which is essential for managing packages.

2. install your fav code editor :

   I will be using VsCode , you can use any text editor you like .

   to install VsCode go to the Official website and install it on your machine

3. Create a New Solid.js Project:

   to create a solid.js project open your VsCode and open the directory you wanna install project inside .

   Then open your VsCode terminal , and enter this command

npx degit solidjs/templates/js sApp

and press Enter you can run this command from command prompt as well after navigating to the directory where you wanna create the project (I am saying this for windows OS, as I am using it)

This command will clone the Solid.js starter template into a folder named sApp. You can name it any name you prefer for your project.

4. Enter project directory :

   as I said inside the project folder you'll get a folder with the app name you named , for me its sApp .

   so to work inside sApp I need to enter that folder through my terminal and you can do this with a simple command

cd sApp

there's also another way you can enter the app directory is just right click on the app directly and click on open integrated terminal

5. Install Dependencies:

   now after we enter the app directory we first need to install all the packages and dependencies to run our app and for that you can run this command

npm install

using this command you can install all the packages you need to run the app .

after running this command you can see a new folder came up in your app directory , that's the node modules. tbh idk much about node.js if you know do comment down below any thing which is missing here which I should have included .

6. Run the app

   to run the app just enter this command

npm run dev 
# or 
npm start

This command will start the development server, and you can open your browser to http://localhost:3000 to see your new Solid.js application running.

yeah ! you made it , you created your first solid.js app . and now you can edit the app.jsx to modify the first page you are seeing . for more stay tuned , in further articles we will learn more about it

if you stuck anywhere while creating the app feel free to comment down below , we'll help you out .

stay curious!