index.html

<div class="search-box">
  <input 
    type="test" 
    class="search-box__input js_search-box__input"
  >
</div>
<div class="total-repositories js_total-repositories">0</div>
<div class="repositories js_repositories"></div>

main.less

.search-box {
  border: 1px solid #ccc;
  padding: 10px;
  display: flex;
  
  &__input {
    width: 100%;
    border: 1px solid #ccc;
  }
}

.total-repositories {
  border: 1px solid #ccc;
  padding: 5px;
  margin: 10px 0px;
  font-weight: bold;
}

.repositories {}

.list {
  border: 1px solid #ccc;
  padding: 10px;
  list-style: none;
  background: #fff;
}

.no-results {
  text-align: center;
  border: 1px solid #ccc;
  padding: 5px;
}

RxJS

https://jsfiddle.net/_alexander_/r1tahjqe/3/

rxjs-search.js

const $searchInput       = document.querySelector('.js_search-box__input');
const $repositories      = document.querySelector('.js_repositories');
const $totalRepositories = document.querySelector('.js_total-repositories');

const repositories = (query) => {
  return Rx.Observable.create(function (observer) {
  	const request = superagent
  		.get(`https://api.github.com/search/repositories?q=${ query }&sort=stars&order=desc`);

  	request
    	.end((err, res) => {
				if (err) {
        	return observer.error(err);
        }
        
        observer.next(res);
        observer.complete();
    	});
      
  	return () => request.abort();
  }).map(response => response.body);
};

const repositoriesTpl = (repositories) => {
  if (!repositories || !Array.isArray(repositories)) {
    return `<p class="no-results">No results</p>`;
  }
  
  return `<ul class="list">
    ${ repositories.map((repos) => `<li class="list__item">${ repos.name }</li>`).join('') }
  </ul>`;
};

const searchStream = Rx.Observable
  .fromEvent($searchInput, 'input')
  .map(input => input.target.value)
  .filter(query => query)  
  .debounceTime(100)
  .switchMap(query => repositories(query))
  .share();
  
searchStream
  .subscribe(
  	({ items }) => {
    	$repositories.innerHTML = repositoriesTpl(items);
  	},
    
    ({ status, message }) => {
    	console.log(status, message);
    }
  );

searchStream
  .subscribe(
  	({ total_count }) => {
    	$totalRepositories.innerHTML = total_count || 0;
  	},
    
    ({ status, message }) => {
    	console.log(status, message);
    }
  );