Fswdlab

You might also like

Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 3

Ex.no.

01 Develop a portfolio website for yourself which gives


details about yourself for a potential recruiter.

AIM:
To develop a portfolio website for yourself which gives details about yourself
for a potential recruiter.
PROCEDURE:
Step 1: Start installation of necessary node npm packages.
Step 2: Run the below command in terminal.
-npm install @angularcli
Step 3: After installation of angular create a folder which includes node modules
-ng new create-app
Step 4: After creating a folder run the program folder by using the following
Command
ng serve
Step 5: Create a component using command
ng g c portfolio
Step 6: component dependencies like css,html,ts files are Installed.
Step 7: Edit the Component.html files like home, about,contact,skills webpages.
Step 8: Connect Angular Js to NodeJs using below command
api.get(‘/app/data’,(Req,Res)=>{
res.Json({message:’Hello from node
create a port and listen/JS’ }
const port=3000;
app.listen(port,()=>{
console.log(‘server is running on{$port}’);
Step 9: create an Http request to nodejs server angular.module(‘myapp’,[])
Controller(‘mycontroller’,function($scope,$http){
then (function(response){
$scope.message=response.data.message});
Step 10 To bind the controller using command
ng-controller
Step 11: connect NodeJS to Mongodb after installation
Install mongodb command
npm install mongodb
Connection code:
const mongoclient=require(‘mangodb’).mongoclient;
const url=’mongodb://localhost:27017’;
const dbname=’your-database-name’;
const db=clinet.db(dbname);
MongoClient.connect(url, (err, client) => {
if (err) {
console.error(err);
return;
}
const collection=db.collection(‘your-collection-name’);
Step 11: Run the application using command
ng-serve
and click the url and
See output in this port localhost:5045
Step 12: stop.
RESULT:
Thus the portfolio website was developed and implemented successfully.

You might also like