I'm trying to convert html template to Magento 2.1.3. I started my conversion using blank-sass from Snowdog. Some CSS was sucessfully implemented but I can't figure out many points. One of them is how to implement Idangero.us Swiper to show some promotions in frontend. 

Here is what I did:

I created a swiper.phtml file in <my_theme_root>/Magento_Theme/templates

He is how it looks like: 

    <my_theme_root>/Magento_Theme/templates/swiper.phtml
    ------------
    <section id="home" class="home section image-slider">
       <div class= "home-slider text-center swiper-container-horizontal">
         <!-- Additional required wrapper -->
           <div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px)$
             <!-- Slides -->
             <div class="swiper-slide swiper-slide-active" (...)
             <img src='<?php echo $this->getViewFileUrl('images/slider/slide1.jp
             </div>
             <div class="swiper-slide swiper-slide-active" (...) same as above for slide 2
             </div>
          </div>
          <!-- If we need pagination -->
          <div class="swiper-pagination"></div>
    
          <!-- If we need navigation buttons -->
          <div class="swiper-button-prev"></div>
          <div class="swiper-button-next"></div>
    
           <!-- If we need scrollbar -->
          <div class="swiper-scrollbar"></div>                           
    </div>
    </section>
    
    <script>
        require([
            'js/main.js',
            ‘js/vendor',
        ], function ($) {
            jQuery(document).ready(function () {
              var swiper = new Swiper ('.home.slider', {
                  pagination: '.home-pagination',
                  paginationClickable: true,
                  nextButton: '.home-slider-next',
                  prevButton: '.home-slider-prev'
                });
            });
    </script>
    ---------------

I also provided a requirejs-config.js in the root of my theme:

<my_theme_root>/requirejs-config-js

He is how it looks like:

    -----------------
    var config = {
    
        deps:[
          "js/main",
        ],
        paths: {
            "home-slider": {
                “swiper”:            "Magento_Theme/js/vendor”,
            }
        },
        shim: {
            'home-slider': {
                deps: ['jquery']
            }
        }
    };
    -----------------

I edited main.js in my web/js/main.js like this:

---------------

    require(['jquery', 'home-slider'],function($){
        $(document).ready(function() {
            $("after.body.starts").addClass("home.slider").Swiper({items: 1});
        });
    })
    ------------------

 Inside default.xml I placed this code:

    --------------
    <referenceContainer name="home.slider">
                <block class="Magento\Framework\View\Element\Template" name="swiper.js" template="Magento_Theme::swiper.phtml" />
          </referenceContainer>
    ------------------

And in 1column.xml inside Magento_Theme/page_layout/1column.xml I wrote:

    --------------------
    <?xml version="1.0"?>
    
    <layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Mag$
        <update handle="empty"/>
        <referenceContainer name="page.wrapper">
            <container name="header.container" as="header_container" label="Page Header Container"  htmlTag="header" htmlClass="page-h$
            <container name="page.top" as="page_top" label="After Page Header" after="header.container"/>
            <container name="home.slider" as="Swiper" label="Slider box container" after="page.top" htmlTag="div" htmlClass="home-slid$
            <container name="footer-container" as="footer" before="before.body.end" label="Page Footer Container" htmlTag="footer" htm$
        </referenceContainer>
    
    </layout>
    ------------------

In web/js I have main.js and vendor folder containing:

    bootstrap.js      
    jquery-1.11.2.min.js  
    jquery.countdown.min.js  
    jquery.inview.js  
    swiper.min.js
    bootstrap.min.js  
    jquery.countdown.js   
    jquery.countTo.js        
    swiper.js         
    wow.js

I aditionally checked pub/static/frontend/vendor/theme/en_US and my struture there is as follow:

    Magento_modules
    jquery
    js
    images
    fonts
    web

In web folder, I can only find css folder. My js are in the root of en_US folder. 

I don't know what I'm possibly doing wrong. I used gulp deploy to deploy the theme after adding all the files in source folder as instructions on blank-sass.

If someone can help me to achieve that, I read the documents about requirejs but I'm not sure I totally understand it. 

Thank you, 
Gabriela