229 lines
10 KiB
HTML
229 lines
10 KiB
HTML
{% extends "_base.html" %}
|
|
|
|
{% block title %}Portfolio{% endblock %}
|
|
|
|
{% block main %}
|
|
<article>
|
|
<section>
|
|
<h5>Contents</h5>
|
|
<ol>
|
|
<li><a href="#websites">Websites</a></li>
|
|
<li><a href="#webapps-list">Web applications</a></li>
|
|
<li><a href="#assignments-list">School projects</a></li>
|
|
</ol>
|
|
</section>
|
|
<section id="websites">
|
|
<h3>Websites</h3>
|
|
<div class="website-list">
|
|
<a class="website-list__item" href="https://blog.monolithofminds.com/">
|
|
<img src="/images/website_mom.png">
|
|
<strong>Monolith of Minds Blog</strong><br>
|
|
<small>Custom Ghost blog theme <br>Handlebars, HTML5, CSS3</small>
|
|
</a>
|
|
<a class="website-list__item" href="https://jhcillustration.com/">
|
|
<img src="/images/website_jhc.png">
|
|
<strong>JHC Illustration</strong><br>
|
|
<small>Online portfolio for a graphic designer<br>HTML5, CSS3, Vue</small>
|
|
</a>
|
|
<a class="website-list__item" href="https://jjayberthumemusic.com/">
|
|
<img src="/images/website_berthume.png">
|
|
<strong>JJay Berthume Music</strong><br>
|
|
<small>Online portfolio for a composer<br>HTML5, CSS3</small>
|
|
</a>
|
|
<a class="website-list__item" href="http://wallyworks.net/">
|
|
<img src="/images/website_wallyworks.png">
|
|
<strong>Wallyworks Construction</strong><br>
|
|
<small>Website for construction company<br>HTML5, CSS3</small>
|
|
</a>
|
|
<a class="website-list__item" href="https://owlsprit.nathanjchapman.com/">
|
|
<img src="/images/website_owlsprit.png">
|
|
<strong>Owl Sprit Cafe</strong><br>
|
|
<small>Website for a small restaurant<br>HTML5, CSS3, Vue</small>
|
|
</a>
|
|
<a class="website-list__item" href="https://bltc.nathanjchapman.com/">
|
|
<img src="/images/website_bltc.png">
|
|
<strong>Better Living Coffee</strong><br>
|
|
<small>Website for a coffee shop<br>HTML5, CSS3</small>
|
|
</a>
|
|
<a class="website-list__item" href="http://ptdefense.com/">
|
|
<img src="/images/website_ptdefense.png">
|
|
<strong>PT Defense</strong><br>
|
|
<small>Website for a Lawyer<br>HTML5, CSS3</small>
|
|
</a>
|
|
<a class="website-list__item" href="http://jac.nathanjchapman.com/">
|
|
<img src="/images/website_jac.png">
|
|
<strong>JAC Defenders</strong><br>
|
|
<small>Website for attorneys<br>HTML5, CSS3</small>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
<section id="webapps-list">
|
|
<h3>Web Applications</h3>
|
|
<h5>Contents</h5>
|
|
<ol>
|
|
<li>
|
|
<a href="#btech-time-tracker">BTech Time Tracker</a>
|
|
</li>
|
|
<li>
|
|
<a href="#workdesk">Workdesk</a>
|
|
</li>
|
|
<li>
|
|
<a href="#btech-cna-charting">BTech CNA Charting</a>
|
|
</li>
|
|
<li>
|
|
<a href="#workroom">Workroom</a>
|
|
</li>
|
|
</ol>
|
|
<h4 id="btech-time-tracker">BTech Time Tracker</h4>
|
|
<p>Track and manage sessions<br><small>Django, HTML5, SCSS</small></p>
|
|
<div class="carousel-wrapper btech-time-tracker">
|
|
<div class="carousel">
|
|
<figure class="carousel__photo initial">
|
|
<img src="/images/time_home.png">
|
|
<figcaption>Welcome page</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/time_profile.png">
|
|
<figcaption>Student profile and recent activity</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/time_log.png">
|
|
<figcaption>Past sessions (pagination)</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/time_scan.png">
|
|
<figcaption>Scan a QR code to clock in</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/time_instructor.png">
|
|
<figcaption>Instructor home page shows activity for department</figcaption>
|
|
</figure>
|
|
|
|
<div class="carousel__button--next"></div>
|
|
<div class="carousel__button--prev"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<h4 id="workdesk">Workdesk</h4>
|
|
<p>Shift assignments and preferences<br><small>Django, Stimulusjs, HTML5, CSS3</small></p>
|
|
<div class="carousel-wrapper workdesk">
|
|
<div class="carousel">
|
|
<figure class="carousel__photo initial">
|
|
<img src="/images/wd_home.png">
|
|
<figcaption>All shifts</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/wd_filter.png">
|
|
<figcaption>Type to filter shifts</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/wd_detail.png">
|
|
<figcaption>See employee details</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/wd_sort.png">
|
|
<figcaption>Employee can sort their shift preferences</figcaption>
|
|
</figure>
|
|
|
|
<div class="carousel__button--next"></div>
|
|
<div class="carousel__button--prev"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<h4 id="btech-cna-charting">BTech CNA Charting</h4>
|
|
<p>Certified Nurse Assistant Charting Application<br><small>Django, Stimulusjs, HTML5, CSS3</small></p>
|
|
<div class="carousel-wrapper btech-cna-charting">
|
|
<div class="carousel">
|
|
<figure class="carousel__photo initial">
|
|
<img src="/images/charting_01.png" alt="">
|
|
<figcaption>Track charting information</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/charting_02.png" alt="">
|
|
<figcaption>Create a new chart</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/charting_03.png" alt="">
|
|
<figcaption>Add a new entry</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/charting_04.png" alt="">
|
|
<figcaption>Input patient vitals</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/charting_05.png" alt="">
|
|
<figcaption>Review information recorded, automatically sorted by time</figcaption>
|
|
</figure>
|
|
|
|
<div class="carousel__button--next"></div>
|
|
<div class="carousel__button--prev"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<h4 id="workroom">Workroom</h4>
|
|
<p>Timecards and labor tracking<br><small>Django, HTML5, CSS3</small></p>
|
|
<div class="carousel-wrapper workroom-carousel">
|
|
<div class="carousel">
|
|
<figure class="carousel__photo initial">
|
|
<img src="/images/workroom_01.png">
|
|
<figcaption>Employee timecard</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/workroom_02.png">
|
|
<figcaption>Input daily tasks</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/workroom_03.png">
|
|
<figcaption>Manage projects for consistent naming</figcaption>
|
|
</figure>
|
|
<figure class="carousel__photo">
|
|
<img src="/images/workroom_04.png">
|
|
<figcaption>See and edit task details</figcaption>
|
|
</figure>
|
|
|
|
<div class="carousel__button--next"></div>
|
|
<div class="carousel__button--prev"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section id="assignments-list">
|
|
<h2>Assignments and projects</h2>
|
|
<p>I'm currently attending <a href="https://btech.edu/">Bridgerland Technical College</a> and this page is a collection of links to projects and assignments I've made. A portfolio from school.</p>
|
|
<dl>
|
|
<dt>PHP Work</dt>
|
|
<dd>
|
|
<a href="http://btech-php.nathanjchapman.com/">Website</a> /
|
|
<a href="https://github.com/nathanjchapman/btech-php">Github</a>
|
|
</dd>
|
|
|
|
<dt>MySQL</dt>
|
|
<dd><a href="https://github.com/nathanjchapman/btech-mysql">Github</a></dd>
|
|
|
|
<dt>SQL Sandbox</dt>
|
|
<dd><a href="https://github.com/nathanjchapman/sql-sandbox">Github</a></dd>
|
|
|
|
<dt>BTech Time Tracker</dt>
|
|
<dd>
|
|
<a href="https://btech-timetracker.nathanjchapman.com/">Website</a> /
|
|
<a href="https://github.com/nathanjchapman/btech-timetracker/">Github</a>
|
|
</dd>
|
|
<dd>With Django, Postgresql, Javascript</dd>
|
|
|
|
<dt>Python Exercises</dt>
|
|
<dd><a href="https://github.com/nathanjchapman/python">Github</a></dd>
|
|
|
|
<dt>Typing Test with Javascript</dt>
|
|
<dd>
|
|
<a href="https://btech-typingtest.nathanjchapman.com/">Website</a> /
|
|
<a href="https://github.com/nathanjchapman/btech-typingtest">Github</a>
|
|
</dd>
|
|
|
|
<dt>Analog Clock with Javascript</dt>
|
|
<dd>
|
|
<a href="https://btech-clock.nathanjchapman.com/">Website</a> /
|
|
<a href="https://github.com/nathanjchapman/btech-clock">Github</a>
|
|
</dd>
|
|
</dl>
|
|
</section>
|
|
</article>
|
|
{% endblock %} |