AFullStackBoss/html/Full-Stack-Web-Developer.html at master · afullstackboss/AFullStackBoss

675 lines (576 loc) · 23.8 KB
<!DOCTYPE html>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="A Full Stack Boss - Album Project">
    <meta name="generator" content="A Full Stack Boss">
    <title>A Full Stack Boss - Album Project</title>
    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
    <link rel="canonical" href="https://getbootstrap.com/docs/4.5/examples/album/">
    <link rel="stylesheet" type="text/css" href="afsb.css"></li>
<div class="container">
  <header class="blog-header py-3">
    <div class="row flex-nowrap justify-content-between align-items-center">
      <div class="col-4 pt-1">
        <a class="text-muted" href="#">Subscribe</a>
      </div>
      <div class="col-4 text-center">
        <a class="blog-header-logo text-dark" href="#">Large</a>
      </div>
      <div class="col-4 d-flex justify-content-end align-items-center">
        <a class="text-muted" href="#" aria-label="Search">
          <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="mx-3" role="img" viewBox="0 0 24 24" focusable="false"><title>Search</title><circle cx="10.5" cy="10.5" r="7.5"/><path d="M21 21l-5.2-5.2"/></svg>
        </a>
        <a class="btn btn-sm btn-outline-secondary" href="#">Sign up</a>
      </div>
  </header>
  <div class="nav-scroller py-1 mb-2">
    <nav class="nav d-flex justify-content-between">
      <a class="p-2 text-muted" href="#">World</a>
      <a class="p-2 text-muted" href="#">U.S.</a>
      <a class="p-2 text-muted" href="#">Technology</a>
      <a class="p-2 text-muted" href="#">Design</a>
      <a class="p-2 text-muted" href="#">Culture</a>
      <a class="p-2 text-muted" href="#">Business</a>
      <a class="p-2 text-muted" href="#">Politics</a>
      <a class="p-2 text-muted" href="#">Opinion</a>
      <a class="p-2 text-muted" href="#">Science</a>
      <a class="p-2 text-muted" href="#">Health</a>
      <a class="p-2 text-muted" href="#">Style</a>
      <a class="p-2 text-muted" href="#">Travel</a>
  <div class="jumbotron p-4 p-md-5 text-white rounded bg-dark">
    <div class="col-md-12 px-0">
      <h1 class="display-4 font-italic">Full Stack Web Developer</h1>
      <p class="lead my-3">Multiple lines of text that form the lede, informing new readers quickly and efficiently about what’s most interesting in this post’s contents.</p>
      <p class="lead mb-0"><a href="#" class="text-white font-weight-bold">Continue reading...</a></p>
  <div class="row mb-2">
    <div class="col-md-6">
      <div class="row no-gutters border rounded overflow-hidden flex-md-row mb-4 shadow-sm h-md-250 position-relative">
        <div class="col p-4 d-flex flex-column position-static">
          <strong class="d-inline-block mb-2 text-primary">World</strong>
          <h3 class="mb-0">Featured post</h3>
          <div class="mb-1 text-muted">Nov 12</div>
          <p class="card-text mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
          <a href="#" class="stretched-link">Continue reading</a>
        </div>
        <div class="col-auto d-none d-lg-block">
          <svg class="bd-placeholder-img" width="200" height="250" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
        </div>
      </div>
    <div class="col-md-6">
      <div class="row no-gutters border rounded overflow-hidden flex-md-row mb-4 shadow-sm h-md-250 position-relative">
        <div class="col p-4 d-flex flex-column position-static">
          <strong class="d-inline-block mb-2 text-success">Design</strong>
          <h3 class="mb-0">Post title</h3>
          <div class="mb-1 text-muted">Nov 11</div>
          <p class="mb-auto">This is a wider card with supporting text below as a natural lead-in to additional content.</p>
          <a href="#" class="stretched-link">Continue reading</a>
        </div>
        <div class="col-auto d-none d-lg-block">
          <svg class="bd-placeholder-img" width="200" height="250" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg>
        </div>
      </div>
<main role="main" class="container">
  <div class="row">
    <div class="col-md-8 blog-main">
      <h3 class="pb-4 mb-4 font-italic border-bottom">
        From the Roland Diaz
      </h3>
      <div class="blog-post">
        <h2 class="blog-post-title">About Full Stack Web Developer</h2>
        <p class="blog-post-meta">Ausgut 25, 2020 by <a href="#">Roland</a></p>
        <p>This blog post shows the functions of a Full Stack Web Developer</p>
        <hr>
        <h3>What is Full Stack Web Developer?</h3>
<p style="text-align: justify;">We are looking for a highly skilled computer programmer who is comfortable with both front and back end programming. Full Stack Developers are responsible for developing and designing front end web architecture, ensuring the responsiveness of applications and working alongside graphic designers for web design features, among other duties.</p>
<p style="text-align: justify;">Full Stack Developers will be required to see out a project from conception to final product, requiring good organizational skills and attention to detail.</p>>
<p style="text-align: justify;">We are looking for a highly skilled computer programmer who is comfortable with both front and back end programming. Full Stack Developers are responsible for developing and designing front end web architecture, ensuring the responsiveness of applications and working alongside graphic designers for web design features, among other duties.</p>
<p style="text-align: justify;">Full Stack Developers will be required to see out a project from conception to final product, requiring good organizational skills and attention to detail.</p>
<h4 style="text-align: justify;">Responsibilities:</h4>
	<li>Developing front end website architecture</li>
	<li>Designing user interactions on web pages</li>
	<li>Knows how to troubleshoot and identify front end and back end issues</li>
	<li>Ensuring cross-platform optimization for mobile phones</li>
	<li>Ensuring responsiveness of websites and web applications</li>
	<li>Working/Designing alongside graphic designers for web design features</li>
	<li>Seeing through a project from conception to finished product</li>
	<li>Designing and developing APIs</li>
	<li>Meeting both technical and consumer needs</li>
	<li>Staying abreast of developments in web designs, applications and programming languages</li>
<h4>Requirements:</h4>
<p style="text-align: justify;">Bachelor’s Degree in Computer Science, Information Technology, or equivalent
Has at least 3-5 years of experience in front end and back end programming
Has experience in website creation for clients
Proficiency with fundamental front-end languages such as HTML, CSS and JavaScript – must have
Familiarity with database technology such as MySQL, Oracle and MongoDB – must have
Familiarity with JavaScript frameworks such as Angular JS, React and Amber – good to have
Proficiency with server-side languages such as Python, Ruby, Java, PHP and .Net – good to have
Background in UI/UX, SEO, and PPC a plus
Strong organizational and project management skills
Excellent verbal communication skills.
Proactive and has excellent analytical & problem-solving skills
Attention to detail
Customer experience background a plus
Amenable to work on a mid-shift (4 pm-12 mn) schedule</p>
<p style="text-align: justify;">LexisNexis Legal & Professional (www.lexisnexis.com) is a leading global provider of content and technology solutions that enable professionals in legal, corporate, tax, government, academic and non-profit organizations to make informed decisions and achieve better business outcomes.  As a digital pioneer, the company was the first to bring legal and business information online with its Lexis« and Nexis« services. Today, LexisNexis Legal & Professional harnesses leading-edge technology and world-class content, to help professionals work in faster, easier and more effective ways. Through close collaboration with its customers, the company ensures organizations can leverage its solutions to reduce risk, improve productivity, increase profitability and grow their business. Part of RELX Group plc, LexisNexis Legal & Professional serves customers in more than 100 countries with 10,000 employees worldwide.</p>
<p style="text-align: justify;">LexisNexis, a division of RELX Group, is an equal opportunity employer: qualified applicants are considered for and treated during employment without regard to race, color, creed, religion, sex, national origin, citizenship status, disability status, protected veteran status, age, marital status, sexual orientation, gender identity, genetic information, or any other characteristic protected by law. If a qualified individual with a disability or disabled veteran needs a reasonable accommodation to use or access our online system, that individual should please contact 1.877.734.1938 or accommodations@relx.com.</p>
      </div><!-- /.blog-post -->
      <nav class="blog-pagination">
        <a class="btn btn-outline-primary" href="#">Older</a>
        <a class="btn btn-outline-secondary disabled" href="#" tabindex="-1" aria-disabled="true">Newer</a>
      </nav>
    </div><!-- /.blog-main -->
    <aside class="col-md-4 blog-sidebar">
      <div class="p-4 mb-3 bg-light rounded">
        <h4 class="font-italic">About</h4>
        <p class="mb-0">Etiam porta <em>sem malesuada magna</em> mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.</p>
      </div>
      <div class="p-4">
        <h4 class="font-italic">Archives</h4>
        <ol class="list-unstyled mb-0">
          <li><a href="#">March 2014</a></li>
          <li><a href="#">February 2014</a></li>
          <li><a href="#">January 2014</a></li>
          <li><a href="#">December 2013</a></li>
          <li><a href="#">November 2013</a></li>
          <li><a href="#">October 2013</a></li>
          <li><a href="#">September 2013</a></li>
          <li><a href="#">August 2013</a></li>
          <li><a href="#">July 2013</a></li>
          <li><a href="#">June 2013</a></li>
          <li><a href="#">May 2013</a></li>
          <li><a href="#">April 2013</a></li>
        </ol>
      </div>
      <div class="p-4">
        <h4 class="font-italic">Elsewhere</h4>
        <ol class="list-unstyled">
          <li><a href="#">GitHub</a></li>
          <li><a href="#">Twitter</a></li>
          <li><a href="#">Facebook</a></li>
        </ol>
      </div>
    </aside><!-- /.blog-sidebar -->
  </div><!-- /.row -->
<h2>What Can JavaScript Do?</h2>
<p id="id1">JavaScript can change HTML content.</p>
<button type="button" onclick='document.getElementById("id1").innerHTML = "Hello JavaScript!"'>Click Me!</button>
<h2>What Can JavaScript Do?</h2>
<p>JavaScript can change HTML attribute values.</p>
<p>In this case JavaScript changes the value of the src (source) attribute of an image.</p>
<button onclick="document.getElementById('myImage').src='img/pic_bulbon.gif'">Turn on the light</button>
<img id="myImage" src="img/pic_bulboff.gif" style="width:100px">
<button onclick="document.getElementById('myImage').src='img/pic_bulboff.gif'">Turn off the light</button>
<h2>What Can JavaScript Do?</h2>
<p id="id2">JavaScript can change the style of an HTML element.</p>
<button type="button" onclick="document.getElementById('id2').style.fontSize='35px'">Click Me!</button>
<h2>What Can JavaScript Do?</h2>
<p id="id3">JavaScript can hide HTML elements.</p>
<button type="button" onclick="document.getElementById('id3').style.display='none'">Click Me!</button>
<h2>What Can JavaScript Do?</h2>
<p>JavaScript can show hidden HTML elements.</p>
<p id="id4" style="display:none">Hello JavaScript!</p>
<button type="button" onclick="document.getElementById('id4').style.display='block'">Click Me!</button>
<h2>JavaScript in Body</h2>
<p id="id5"></p>
<h2>JavaScript in Head</h2>
<p id="id6">A Paragraph.</p>
<button type="button" onclick="myHead()">Try it</button>
<h2>My First Web Page</h2>
<p>My First Paragraph.</p>
<p id="id7"></p>
<h2>My First Web Page</h2>
<p>My first paragraph.</p>
<p>Never call document.write after the document has finished loading.
It will overwrite the whole document.</p>
<script>document.write(5 + 6);</script>  
<h2>My First Web Page</h2>
<p>My first paragraph.</p>
<button type="button" onclick="document.write(5 + 6)">Try it</button>
window.alert("Welcome to a Full Stack Web Developer");
<h2>Activate Debugging</h2>
<p>F12 on your keybord will activate debugging.</p>
<p>Then select "Console" in the debugger menu.</p>
<p>Then click Run again.</p>
<script>console.log(5 * 6 * 7 + 6 + 55 - 2);</script>
<h2>The window.print() Method</h2>
<p>Click the button to print the current page.</p>
<button onclick="window.print()">Print this page</button>
<h2>JavaScript Statements</h2>
<p>A <b>JavaScript program</b> is a list of <b>statements</b> to be executed by a computer.</p>
<p id="id8"></p>
var x, y, z;  // Statement 1
x = 5;        // Statement 2
y = 6;        // Statement 3
z = x + y;    // Statement 4
document.getElementById("id8").innerHTML =
"The value of z is " + z + ".";  
<h2>JavaScript Statements</h2>
<p>In HTML, JavaScript statements are executed by the browser.</p>
<p id="id9"></p>
document.getElementById("id9").innerHTML = "Hello Roland Diaz";
<h2>JavaScript Statements</h2>
<p>JavaScript statements are separated by semicolons.</p>
<p id="id10"></p>
var a, b, c;
document.getElementById("id10").innerHTML = c;
<h2>JavaScript Statements</h2>
<p>Multiple statements on one line is allowed.</p>
<p id="id11"></p>
var a, b, c;
a = 5; b = 6; c = a + b;
document.getElementById("id11").innerHTML = c;
<h2>JavaScript Statements</h2>
The best place to break a code line is after an operator or a comma.
<p id="id12"></p>
document.getElementById("id12").innerHTML =
"Hello Dolly!";
<h2>JavaScript Statements</h2>
<p>JavaScript code blocks are written between { and }</p>
<button type="button" onclick="myFunction()">Click Me!</button>
<p id="id13"></p>
<p id="id14"></p>
function myFunction() {
  document.getElementById("id13").innerHTML = "Hello Dolly!";
  document.getElementById("id14").innerHTML = "How are you?";
<h2>JavaScript Numbers</h2>
<p>Number can be written with or without decimals.</p>
<p id="id15"></p>
document.getElementById("id15").innerHTML = 10.50;
<h2>JavaScript Strings</h2>
<p>Strings can be written with double or single quotes.</p>
<p id="id16"></p>
document.getElementById("id16").innerHTML = 'John Doe';
<h2>JavaScript Variables</h2>
<p>In this example, x is defined as a variable.
Then, x is assigned the value of 6:</p>
<p id="id17"></p>
document.getElementById("id17").innerHTML = x;
<h2>JavaScript Operators</h2>
<p>JavaScript uses arithmetic operators to compute values (just like algebra).</p>
<p id="id18"></p>
document.getElementById("id18").innerHTML = (5 + 6) * 10;
<h2>Assigning JavaScript Values</h2>
<p>In JavaScript the = operator is used to assign values to variables.</p>
<p id="id19"></p>
document.getElementById("id19").innerHTML = x + y;
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="id20"></p>
document.getElementById("id20").innerHTML = 5 * 10;
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="id21"></p>
document.getElementById("id21").innerHTML = x * 10;
<h2>JavaScript Expressions</h2>
<p>Expressions compute to values.</p>
<p id="id22"></p>
document.getElementById("id22").innerHTML = "John" + " "  + "Doe";
<h2>The var Keyword Creates Variables</h2>
<p id="id23"></p>
y = x * 10;
document.getElementById("id23").innerHTML = y;
<h2>JavaScript Comments are NOT Executed</h2>
<p id="id24"></p>
// x = 6; I will not be executed
document.getElementById("id24").innerHTML = x;
<h2>JavaScript is Case Sensitive</h2>
<p>Try change lastName to lastname.</p>
<p id="id25"></p>
var lastname, lastName;
lastName = "Doe";
lastname = "Peterson";
document.getElementById("id25").innerHTML = lastName;
<h1 id="myH"></h1>
<p id="myP"></p>
// Change heading:
document.getElementById("myH").innerHTML = "JavaScript Comments";
// Change paragraph:
document.getElementById("myP").innerHTML = "My first paragraph.";
<h2>JavaScript Comments</h2>
<p id="id126"></p>
var x = 5;    // Declare x, give it the value of 5
var y = x + 2;  // Declare y, give it the value of x + 2 
// Write y to demo:
document.getElementById("id126").innerHTML = y;
<h1 id="myH1"></h1>
<p id="myP1"></p>
The code below will change
the heading with id = "myH"
and the paragraph with id = "myP"
document.getElementById("myH1").innerHTML = "JavaScript Comments";
document.getElementById("myP1").innerHTML = "My first paragraph.";
<h2>JavaScript Comments</h2>
<h1 id="myH2"></h1>
<p id="myP2"></p>
//document.getElementById("myH").innerHTML = "My First Page";
document.getElementById("myP2").innerHTML = "My first paragraph.";
<p>The line starting with // is not executed.</p>
<h2>JavaScript Comments</h2>
<h1 id="myH3"></h1>
<p id="myP3"></p>
document.getElementById("myH").innerHTML = "Welcome to my Homepage";
document.getElementById("myP").innerHTML = "This is my first paragraph.";
document.getElementById("myP3").innerHTML = "The comment-block is not executed.";
<h2>JavaScript Variables</h2>
<p>In this example, x, y, and z are variables.</p>
<p id="126"></p>
var z = x + y;
document.getElementById("126").innerHTML =
"The value of z is: " + z;
<h2>JavaScript Variables</h2>
<p id="id127"></p>
var price1 = 5;
var price2 = 6;
var total = price1 + price2;
document.getElementById("127").innerHTML =
"The total is: " + total;
<h2>JavaScript Variables</h2>
<p>Strings are written with quotes.</p>
<p>Numbers are written without quotes.</p>
<p id="128"></p>
var pi = 3.14;
var person = "John Doe";
var answer = 'Yes I am!';
document.getElementById("128").innerHTML =
pi + "<br>" + person + "<br>" + answer;
<h2>JavaScript Variables</h2>
<p>Create a variable, assign a value to it, and display it:</p>
<p id="129"></p>
var carName = "Volvo";
document.getElementById("129").innerHTML = carName;
<h2>JavaScript Variables</h2>
<p>You can declare many variables in one statement.</p>
<p id="130"></p>
var person = "John Doe", carName = "Volvo", price = 200;
document.getElementById("130").innerHTML = carName;
<h2>JavaScript Variables</h2>
<p>A variable declared without a value will have the value undefined.</p>
<p id="131"></p>
var carName;
document.getElementById("131").innerHTML = carName;
<h2>JavaScript Variables</h2>
<p>If you re-declare a JavaScript variable, it will not lose its value.</p>
<p id="132"></p>
var carName = "132";
var carName;
document.getElementById("132").innerHTML = carName;
<h2>JavaScript Variables</h2>
<p>The result of adding 5 + 2 + 3:</p>
<p id="133"></p>
var x = 5 + 2 + 3;
document.getElementById("133").innerHTML = x;
<h2>JavaScript Variables</h2>
<p>The result of adding "John" + " " + "Doe":</p>
<p id="134"></p>
var x = "John" + " " + "Doe";
document.getElementById("134").innerHTML = x;
<h2>JavaScript Variables</h2>
<p>The result of adding "5" + 2 + 3:</p>
<p id="135"></p>
x = "5" + 2 + 3;
document.getElementById("135").innerHTML = x;
<h2>JavaScript Variables</h2>
<p>The result of adding 2 + 3 + "5":</p>
<p id="136"></p>
var x = 2 + 3 + "5";
document.getElementById("136").innerHTML = x;
<h2>JavaScript $</h2>
<p>The dollar sign is treated as a letter in JavaScript names.</p>
<p id="137"></p>
var $myMoney = 5;
document.getElementById("137").innerHTML = $ + $myMoney;
<h2>JavaScript $</h2>
<p>The underscore is treated as a letter in JavaScript names.</p>
<p id="138"></p>
var _x = 2;
var _100 = 5;
document.getElementById("138").innerHTML = _x + _100;
<h2>JavaScript Functions</h2>
<p>This example calls a function which performs a calculation, and returns the result:</p>
<p id="139"></p>
function myFunction(p1, p2) {
  return p1 * p2;
document.getElementById("139").innerHTML = myFunction(4, 3);
<h2>JavaScript Functions</h2>
<p>This example calls a function which performs a calculation and returns the result:</p>
<p id="140"></p>
var x = myFunction(4, 3);
document.getElementById("140").innerHTML = x;
function myFunction(a, b) {
  return a * b;
<h2>JavaScript Functions</h2>
<p>This example calls a function to convert from Fahrenheit to Celsius:</p>
<p id="141"></p>
function toCelsius(f) {
  return (5/9) * (f-32);
document.getElementById("141").innerHTML = toCelsius(77);
<h2>JavaScript Functions</h2>
<p>Accessing a function without () will return the function definition instead of the function result:</p>
<p id="142"></p>
function toCelsius(f) {
  return (5/9) * (f-32);
document.getElementById("142").innerHTML = toCelsius;
<h2>JavaScript Functions</h2>
<p id="143"></p>
document.getElementById("143").innerHTML =
"The temperature is " + toCelsius(77) + " Celsius";
function toCelsius(fahrenheit) {
  return (5/9) * (fahrenheit-32);
<h2>JavaScript Functions</h2>
<p>Outside myFunction() carName is undefined.</p>
<p id="144"></p>
<p id="145"></p>
myFunction();
function myFunction() {
  var carName = "Volvo";
  document.getElementById("144").innerHTML =
  typeof carName + " " + carName;
document.getElementById("145").innerHTML =
typeof carName;
</main><!-- /.container -->
<footer class="text-muted">
  <div class="container">
    <p>Album example is &copy; Bootstrap, but please download and customize it for yourself!</p>
    <p>New to Bootstrap? <a href="https://getbootstrap.com/">Visit the homepage</a> or read our <a href="../getting-started/introduction/">getting started guide</a>.</p>
     <p class="float-right">
      <a href="#">Back to top</a>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>
<script src="afsb.js"></script>
Provide feedback

Saved searches

Use saved searches to filter your results more quickly

FilesExpand file tree

Full-Stack-Web-Developer.html

Latest commit

History

Full-Stack-Web-Developer.html

File metadata and controls
