resume-template1 v0.0.3

Angular Resume Template

We have multiple templates. Which you can use to create resume for free using Angular application.

You just need to pass the valuable data. Then data automatically print on the template.

Pre-Requests

Use the package manager

npm install bulma
npm install resume-template1
npm install font-awesome --save

Add bulma in angular.ts file.

 "styles": [
              "src/styles.scss",
              "node_modules/bulma/css/bulma.css"
            ],

Add Fontawesome in angular.ts file.

You have install the fontawesome in the main project. Go to fontawesome. Add read the document. OR

  <script src="https://kit.fontawesome.com/--KitNumber--.js" crossorigin="anonymous"></script>
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>

Templates we you can use

1. resume-template1

How to install the templates

npm install ##template-name###

How to use templates

Template Configuration model

export class ResumeConfigurationModel {
  headerNameModel!: ResumeHeader;
  userModel!: UserModel;
  educationModel?: EducationModel[];
  expertise?: string[];
  workExp?: WorkExperienceModel[];
  companyExp?: CompanyExpModel[];
  hobbies?: HobbiesModel[];
  declaration?: string;
  aboutYou?: string;
}

You have to do some basic configuration to use the template.

Create a new file Name:

template1.configuration.module.ts

const config: ResumeConfigurationModel = {
  userModel: {
    address: 'Hyderabad',
    email: 'example.mail@email.com',
    phone: '+91-909090900',
    dateOfBirth: new Date(1991, 7, 6),
    maritalStatus: MaritalStatusEnum.Married,
    fatherName: 'Father Name',
    motherName: 'Mother Name',
    currentPlace: 'Banglore',
    languages: ["English", "Hindi"]
  },
  headerNameModel: {
    firstName: 'FirstName',
    lastName: 'LastName',
    technologyStack: 'Full Stack Developer',
    imageUrl: '../assets/img/imgPath.jpg'
  },
  educationModel: [
    {
      className: 'MCA',
      passingYear: '2012-2015',
      schoolName: 'ABC University',
      majorSubject: 'C, C++'
    },
    {
      className: 'BCA',
      passingYear: '2008-2012',
      schoolName: 'ABC University',
      majorSubject: 'Data Structure'
    },
    {
      className: '12th',
      passingYear: '2008',
      schoolName: 'ABC Sen. Sec. School',
      majorSubject: 'Non Medical'
    },
    {
      className: '10th',
      passingYear: '2006',
      schoolName: 'ABC Public School',
      majorSubject: 'Arts'
    }
  ],
  companyExp: [{
    companyName: 'Company Name',
    joiningDate: new Date(2021, 11, 1),
    position: 'SDE-III',
  },
  {
    companyName: 'Company Name',
    joiningDate: new Date(2020, 6, 7),
    leavingDate: new Date(2021, 11, 1),
    position: 'Sen. Developer',
  },
  {
    companyName: 'Company Name',
    joiningDate: new Date(2018, 5, 1),
    leavingDate: new Date(2020, 6, 7),
    position: 'Software Developer',
  }],
  expertise: [
    "ASP.NET Core",
    "NodeJs",
    "Angular",
    "Microservices",
    "CQRS"
  ],
  hobbies: [
    {
      hobbyText: 'Cricket',
      materialIconCode: 'sports_cricket'
    },
    {
      hobbyText: 'Badminton',
      materialIconCode: 'sports_tennis'
    },
    {
      hobbyText: 'Music',
      materialIconCode: 'headphones'
    },
    {
      hobbyText: 'Coding',
      materialIconCode: 'code'
    }
  ],
  workExp: [
    {
      projectName: 'Product Name',
      companyName: 'ABC Company Name, Hydrabad',
      position: 'SDE-III',
      aboutProject: `Lorem Lorem Lorem Lorem Lorem Lorem Lorem Lorem Lorem Lorem Lorem Lorem`,
      technologies: [
        "C#",
        "Asp.Net Core",
        "UWP",
        "DRM",
        "Entity Framework Core",
        "REST API"
      ],
      keyPoints: [
        'Key Point 1',
        'Key Point 2',
        'Key Point 3',
        'Key Point 4'
      ],
    }
  ]
}

@NgModule({
  imports: [Template1Module.loadConfig(config)],
  exports: [Template1Module]
})
export class Template1ConfigurationModule { }

import Template1ConfigurationModule in AppModule

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, Template1ConfigurationModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Open app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: '<lib-home-page></lib-home-page>'
})
export class AppComponent {
}